Javascript使背景图像可点击？答案

【问题标题】：Javascript to make background image clickable?Javascript使背景图像可点击？
【发布时间】：2012-06-16 17:53:32
【问题描述】：

我不能使用 div，因为我使用的 CMS 不允许 html 进入主题样式（它在其编码中使用了一种奇怪的结构）并且我发现唯一有效的是 javascript 但我没有'不知道什么 javascript 代码会启用可点击的背景图像。

有什么想法吗？

<meta name="description" content="description here"> 
<script type="text/javascript"> 
    document.backgroundImage = "url('http://mydomain.com/image.jpg')";
    function callback() { 
        location.href = "http://mylink.com";
    } 
    document.addEventListener("click", callback, false);
</script> 
<script type="text/javascript"> //google analytics code </script>

【问题讨论】：

您使用的 CMS 是什么？
@agentmilindu - 我的老板正在使用 www.question2answer.org/ 中的 questions2answers 来制作问答网站。
嗯，我检查了那个网站，我检查了演示，我以管理员身份登录，我检查了布局选项卡，我可以添加，每个页面顶部的自定义 HTML，每个页面底部的自定义 HTML页面，每个页面的部分中的自定义 HTML，主页中的自定义内容而不是问答，在页面标题中显示徽标图像，包括主页的描述和每个页面的侧边栏框中的自定义 HTML。当有人点击你的 bg-Image 时，你会怎么做？你真的想在这里做什么？

标签： javascript image background clickable

【解决方案1】：

这是某事的背景吧？这个东西必须接收点击事件处理程序。

干杯。

编辑：添加示例：

假设：

o.id = "OhMyCuteness";
o.style.backgroundImage = "url('...')";

然后：

o.addEventListener("click", callback, false);

和：

function callback(clickEvent) {
    alert("They clicked meeeee buhuhuhu: " + clickEvent.target.id);
}

Edit2：如果您的文档具有完全相同的背景，请使用文档而不是元素“o”作为addEventListener 的目标。

【讨论】：

这是正确的。但要澄清一下：无论这个背景图片是什么元素，都是您需要使其可点击的元素。
@Sebas - 那么我应该把背景图片链接和实际的 url 链接放在哪里以使其可点击？
背景图片是通过css属性“backgroundImage”设置的：.style.backgroundImage = "url('http://...')";
@Sebas - 那么当 javascript 和 css 放在一起时，在真实案例中会是什么样子呢？试图弄清楚在哪里放什么。
这是你的背景，别再说“图片”了。您没有使图像可点击，而是使您的文档可点击。我想你可以使用document.body.style.cursor = 'pointer';