Question

我有一个ASP.NET用户控件（ascx），其div的{{1}}打开弹出窗口。我的任务是在此onclick放置一个超链接到其他地方，不打开弹出窗口。我最初的问题是超链接去了其他地方就好了，但它仍然打开了弹出窗口。研究把我带到div。但是，虽然它似乎在Firefox中运行，但它不适用于IE或Chrome。 更重要的是，似乎事件本身并没有接线。我在ASCX上尝试了以下内容：

stopPropagation()

和

 <script type="text/javascript">
    /*global $*/
    $("#voucher1").click(function(e) {
        "use strict";
        e.stopPropagation();
    });
    $("#voucher2").click(function (e) {
        "use strict";
        e.stopPropagation();
    });
</script>

<script type="text/javascript"> /*global $*/ $(function () { "use strict"; $("#voucher1").click(function (e) { e.stopPropagation(); }); $("#voucher2").click(function (e) { e.stopPropagation(); }); }); </script>和voucher1是控件上的简单voucher2标记。我（或浏览器，或两者）做错了什么？

Answer 1

需要阻止锚的默认操作并确保页面已完全加载：

<script type="text/javascript">
    $(document).ready(function(){
        $("#voucher1").click(function(e) {
            e.preventDefault();
            e.stopPropagation();
        });
        $("#voucher2").click(function (e) {
            e.preventDefault();
            e.stopPropagation();
        });
    });
</script>

Answer 2

您的包含div中有多少个元素？这是另一种方法，而不是保持＆＃34;取消弹出＆＃34;链接上的逻辑，将它放在div本身上。

$("your div").delegate("*:not(a)", "click", function () { 
    alert("your popup"); 
});

此方法的优势在于，如果您动态地将<a>标记添加到＆＃34;您的div＆＃34;，那么因为事件处理程序附加在＆＃34;您的div＆＃34;，所有新的孩子仍然连接到事件（或者在你的情况下，没有连接到事件）。

完整示例：

最好在DOM准备好之后添加所有jquery事件处理程序。幸运的是，jquery让你很容易，如下所示：

<html>
<head>
<script src="your jquery"></script>
<script>
    $(document).ready(function() {
        $("#yourdiv").delegate("*:not(a)", "click", function () { 
            alert("your popup"); 
        });
    });
</script>
</head>
<body>
<div id="yourdiv">
    <span>here but</span>
    <a href="#somewhere">not here</a>
</div>
</body>
</html>

Answer 3

找到它没有工作的原因。我的公司渲染此页面的框架动态地将.aspx加载到另一个.aspx（这里是yo，dawg jokes）并且它保持我的JavaScript不在init页面注册，因为子页面从未真正初始化。我找到了一个全局JS，它允许我访问子页面，因为它正在加载它，我在那里弹出我的东西，它可以在任何地方工作。感谢您的建议。

stopPropagation在Firefox中工作，但不适用于IE或Chrome

3 个答案: