Jquery - 无限循环

Question

我有一个网页，里面有一个按钮放在一个div里面。 我的目标是当用户点击div时，会触发内部的按钮。代码大致如下：

<div id='main'>     
 <input id="button" type="button" onclick="javascript:dosomething();"  value="submit" />
</div>


<script type="text/javascript">
    $(function(){
     $('#main').bind('click', function(){
      $('#button').trigger('click');
     })
    })
</script>

当执行（点击div）时，会抛出javascript错误“too much recursion”。这种情况下无限循环有点说得通，但我不确定实现此操作的正确方法是什么？（请不要问我为什么要那样做，这不是我的代码！）

感谢您的帮助！

- BeCool

Answer 1

在按钮点击事件处理程序中停止事件冒泡。

使用e.stopPropagation()

如果您正在使用jQuery，则将所有事件处理程序按照jQuery方式进行。因此，按钮点击将是

$('#button').click(function(e){
    doSomething();
    e.stopPropagation();
});

所以整个事情将会是：

$(function(){ 
    $('#main').bind('click', function(){ 
        $('#button').trigger('click'); 
    });

    $('#button').click(function(e){
        doSomething();
        e.stopPropagation();
    });

});

- rahul

Answer 2

$("#main").on('click', function (e) {
    e.stopPropagation();
    $("#button")[0].click();
});

这对我有用

- vebs