当前位置：文江博客话题详情

检测对包含 Javascript 的 DIV 元素的点击？

发布于 2024-08-18 09:14:37 字数 264 浏览 8 评论 0原文

如何检测从

触发的 javascript 的点击？
例如，我在页面上的 3 个不同

中有 3 个 adSense 广告，我希望在点击广告时检测并触发操作。

当

为空或带有任何其他元素时，很容易检测到对它的点击；但如何检测 adSense 广告（代码）的点击次数？

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

零崎曲识 2024-08-25 09:14:37

据我所知，Adsense 广告加载在 iframe 元素中，因此访问它们将违反同源政策。这意味着您无法检测 iframe 中指向外部 URL 的点击，因此无法完成此操作。

回复收藏 0 原文

过去的过去 2024-08-25 09:14:37

你使用像 jQuery 这样的框架吗？如果是这样，您可以将点击处理程序添加到 div 的子级：

targetElement = $("#yourDivId").children()[0]
$(targetElement).click(function(){
    alert("target element was clicked");
});

are you using any frameworks like jQuery? if so, you could add a click handler to a child of a div:

targetElement = $("#yourDivId").children()[0]
$(targetElement).click(function(){
    alert("target element was clicked");
});

回复收藏 0 原文

那小子欠揍 2024-08-25 09:14:37

如果我真的需要实现这样的目标，我会欺骗用户一点。

不要尝试点击 iframe，而是制作一个覆盖 div 并将其放置在 iframe 上方。给它附加点击事件，当div被点击时，隐藏它。

它会让用户感觉他点击了链接，但它没有正常工作。他第二次点击它就已经起作用了，因为覆盖层被隐藏了。

示例代码（仅用于解释目的）：

<html>
    <style>
        .test {
            position : absolute;
            top : 0;
            left : 0;
            width : 300;
            height : 300;
            z-index : 999;
            filter : alpha(opacity = 0);
            opacity : 0;
            background-color:black;
        }
    </style>
    <script>
        function start(){
            var div = document.getElementById("target");
            var source = document.createElement("div");
            source.className = "test";
            document.body.appendChild(source);

            var style = source.style;

            var div2 = document.createElement("div");
            document.body.appendChild(div2);

            source.onclick = function(e){
                style.display = "none";
                div.onmouseout = function(){
                    div2.innerHTML = "mouseout";
                    style.display = "";
                    div.onmouseout = null;
                }
                div2.innerHTML = "clicked";
            }
        }
    </script>
    <body onload="start()">
        <div id="target">
            <iframe src="http://mail.ru" style="width:300;height:300"></iframe>
        </div>

    </div>
</html>

If I would really need to achieve something like this, I would cheat a bit with the user.

Instead of trying to get click on iframe, make an overlay div and place it above iframe. Attach click event to it, and when div is clicked, hide it.

It will give the user feeling that he clicked on link, but it did not worked correctly. The second time he clicks it will already worked, cause overlay is hidden.

An example code (just for explanation purpose):

<html>
    <style>
        .test {
            position : absolute;
            top : 0;
            left : 0;
            width : 300;
            height : 300;
            z-index : 999;
            filter : alpha(opacity = 0);
            opacity : 0;
            background-color:black;
        }
    </style>
    <script>
        function start(){
            var div = document.getElementById("target");
            var source = document.createElement("div");
            source.className = "test";
            document.body.appendChild(source);

            var style = source.style;

            var div2 = document.createElement("div");
            document.body.appendChild(div2);

            source.onclick = function(e){
                style.display = "none";
                div.onmouseout = function(){
                    div2.innerHTML = "mouseout";
                    style.display = "";
                    div.onmouseout = null;
                }
                div2.innerHTML = "clicked";
            }
        }
    </script>
    <body onload="start()">
        <div id="target">
            <iframe src="http://mail.ru" style="width:300;height:300"></iframe>
        </div>

    </div>
</html>

回复收藏 0 原文

~没有更多了~