点击（click()）触发多次

Question

我正在使用 document.getElementById("val").click() 来触发点击事件，但它一直触发多次。

这里是添加事件处理程序的代码：

try {
    //add mousedown event handler to navigation buttons
    addEventHandler(oPrevArrow, "mousedown", handlePrevDayClick);
    addEventHandler(oNextArrow, "mousedown", handleNextDayClick);
    addEventHandler(oLogout, "mousedown", handleLogoutClick);
} 
catch (err) {
}

在点击事件中，我正在执行“自动点击”

function handleNextDayClick(e) {
    e = e || window.event;
    stopEvent(e);
    document.getElementById("btn_nextday").click();
}

我需要帮助来确定是什么导致了多次调用，并可能提供修复方案。

注意：自动点击的按钮会调用ASP.NET Code-Behind中的一个方法。

- ferronrsmith

Answer 1

通常，当事件被多次触发时，这是因为该事件已经被附加到一个元素上超过一次或者您自动点击的元素是另一个已经附加了同样事件的元素的子元素。请检查它们是否相互包含，如果是，则需要检测当前目标是否等于目标，以确保它仅发生一次。或者您可以停止事件传播。

- Mechlar

Answer 2

尝试使用JQuery连接它：

 $(document).ready(function() {
    $('#oPrevArrow').click(function() {
        $('#btn_prevday').trigger('click');
    });
    $('#oNextArrow').click(function() {
        $('#btn_nextday').trigger('click');
    });
    $('#oLogout').click(function() {
        $('#btn_logout').trigger('click');
    });
 });

这可能会更加简洁，具体取决于箭头和按钮在DOM中的布局。潜在地，它可以是一行jQuery代码。

类似于：

 $(document).ready(function() {
    $('.arrow').click(function() { //note css class selector
        $('this + button').trigger('click');
    });
 });

- Daniel Dyson

---

好的，我想这样做，但我的老板不允许。所以这真的没有帮助。 - ferronrsmith

真是遗憾。也许你可以让你的老板了解一下JQuery。Scott Guthrie经常在他的博客上谈论它。而且微软正在将它包含在他们的Web解决方案模板中，所以它正在迅速成为业界标准的JavaScript库。 - Daniel Dyson

我已经告诉他了，但这完全取决于客户的需求，所以我的话并不重要。 - ferronrsmith

Answer 3

这是由于特定事件绑定了多次到同一个元素所导致的。

对我有效的解决方案是：

使用.die()方法杀死所有附加的事件。

然后再附加您的方法监听器。

因此，

$('.arrow').click(function() {
// FUNCTION BODY HERE
}

应该是：

应该是：

$('.arrow').die("click")
$('.arrow').click(function() {
// FUNCTION BODY HERE
}

- Pupil