Question

我有一个div包含的提交按钮。我想在单击div时触发提交按钮上的单击事件。问题是，此单击事件会冒泡并导致堆栈溢出/无限循环。当我尝试停止传播子点击事件时，问题仍未解决。

HTML：

<div class="container">
    <input type="submit" value="OK">
</div>

jQuery的：

$('.container').click(function () {
    var input = $(this).find('input');
    input.trigger('click');
    input.click(function(event) {
        event.stopPropagation();
    });
});

这仍然会导致堆栈溢出错误。返回false也是如此：

$('.container').click(function () {
    var input = $(this).find('input');
    input.trigger('click');
    return false;
});

帮助表示赞赏！

Answer 1

不要将容器内的按钮点击事件绑定一个。它应该是这样的

$('.container').click(function() {
    var input = $(this).find('input');
    input.trigger('click');
});

$('input').click(function(e) {
    e.stopPropagation();
    alert('button clicked');
});

您的代码存在的问题是容器点击会在其各自的点击处理程序被注册之前触发内部按钮点击，因此它没有机会停止事件冒泡。

使用jQuery单击父项时触发单击提交按钮

1 个答案: