Question

我需要一种方法来阻止多次提交：

$("#myDiv").click(function(e) {
    e.preventDefault();
    console.log('open');

    // submit the form    
    $('#myDiv #myInput').click(function(e){
        e.preventDefault();
        /* ajax call here */
        console.log('clicked');
    });

});

因此，如果我点击#myDiv发送X次，请点击子功能。

例如。如果您点击3次#myDiv，然后点击#myInput将发送3次表单，如果再按一次将发送6。

任何想法如何解决？

Answer 1

好像你是$('#myDiv #myInput') ..

多次绑定点击事件处理程序

您应该将$('#myDiv #myInput').click(function(e){移到$("#myDiv").click(function(e) {的点击处理程序之外，或使用.one(。请注意，在这两种情况下，行为都不同。

此外，还应使用event.stopPropagation();来阻止事件冒泡。

根据您的要求尝试以下代码。以下项目1.和2.工作方式不同，因此请理解代码并根据您的要求实施。

移动#myInput点击事件

$("#myDiv").click(function(e) {
e.preventDefault();
e.stopPropagation();
console.log('open');
});

// submit the form    
$('#myDiv #myInput').click(function(e){
   e.preventDefault();
   e.stopPropagation();
   /* ajax call here */
   console.log('clicked');
 });

请注意，＃myInput的点击处理程序将执行一次。

$("#myDiv").click(function(e) {
   e.preventDefault();
   e.stopPropagation();
   console.log('open');

   // submit the form    
   $('#myDiv #myInput').one(function(e){
    e.preventDefault();
    e.stopPropagation();
    /* ajax call here */
    console.log('clicked');
   });
});

jquery避免多个请求preventDefault

1 个答案: