javascript - Javascript Click 事件触发不止一次

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()，则会多次调用警报。