Question

我在页面上使用了两个div。例如，

<div id="ListPage" data-role="content" style="background-color: gray; background-size: 100%;background-repeat: no-repeat; overflow: hidden;">
<div id="ListPageContent" style="width: 100%;"></div>                   
</div><div id='divViewMore' style='background-color:#D2D0C1;border-radius:5px;width:100%;height:20px;display:block;' align='center'><p style='text-align:center' >View more Here</p>
</div>

这里，listPageContent - 我已动态添加数据。当我点击divViewmore时，它会从我的页面调用2次。以下代码我已经习惯了我的页面。

$(document).ready(function() {
    $("#divViewMore").unbind().click(function() {
        alert('hello');
    });
});

如果我正在使用普通的onclick事件并且还调用处理程序，那么我也面临同样的问题。

我该如何避免这个问题？请做好。

Answer 1

处理点击事件只需要此

$(document).ready(function() {
    $('#divViewMore').click(function() {
        alert('Hello');
    });
});

不确定为什么要使用unbind()

Answer 2

这是正确的方式，因为我认为::

$(document).ready(function() {
    $("#divViewMore").unbind('click');
    $("#divViewMore").click(function() {
        alert('hello');
    });
});

Answer 3

我从你的代码创建了一个小提琴，没有问题。点击事件不会被调用两次。

$("#divViewMore").unbind().click(function () {
    alert('hello');
});

http://jsfiddle.net/TNZCU/

即使我多次添加点击事件也是如此。 unbind（）似乎做了它的工作。

var clickReceived = function () {
    alert('hello');
}
for (var i = 0; i < 3; i++) {        
    $("#divViewMore").unbind().click(clickReceived);
}

http://jsfiddle.net/TNZCU/1/

如果删除.Unbind（），则会多次调用alert。

Javascript单击事件触发多次

3 个答案: