javascript - 多次触发('click')

我有一个系统，在该系统中，您首先选择一个日期，然后单击“主页”按钮，然后调用将具有表格的模式。单击未选择日期的按钮时，它变为红色，并且不执行任何操作。选择日期并单击按钮时，它将添加模态参数，然后再次单击以打开表单。但是，该窗体被打开了N次，从而锁定了整个系统。谁能帮我？

HTML：

<div id="cidade-1256" class="col-sm-4 box-curso">
  <div class="plan wow fadeInLeft animated animated" data-wow-offset="120" data-wow-duration="1.5s" style="visibility: visible; animation-duration: 1.5s; -webkit-animation-duration: 1.5s; animation-name: fadeInLeft; -webkit-animation-name: fadeInLeft;">
    <div class="title">Brasília</div>
      <div class="description">
        <ul><li><button type="button" class="btn btn-curso">AGO | 15 - 16</button></li></ul>
      </div>
      <a id="1256" class="btn btn-primary">ORDER NOW</a>
    </div>
  </div>
</div>

JS：

$(document).on('click', 'a[id]', function(e){
    var id_form = $(this).attr('id').replace('#', '');
    var id_order = '#' + $(this).attr('id');
    if($('#cidade-' + id_form).find('button').hasClass('active')){
       $(id_order).removeClass('btn-curso-error');
       $(id_order).attr('data-toggle', 'modal');
       $(id_order).attr('data-target', '#modal-form');
       $(this).trigger('click');
    }else{
       $(id_order).addClass('btn-curso-error');
    }
});

最佳答案

我相信您需要从按钮中删除.active类，否则它将导致您看到的无限循环。

请参见下面的代码段，我认为这就是您要实现的目标。虽然，我可能不会使用相同的链接来再次链接。

注意：我必须在代码段中将#1256切换为button，您可以将其保留为a标记。

$("#1256").on('click', function(e) {
    var id_form = $(this).attr('id').replace('#', '');
    var $button = $('#cidade-' + id_form).find("button");

    if($button.hasClass('active')){
       $button.removeClass('active');
       $(this).removeClass('btn-curso-error')
              .attr('data-toggle', 'modal')
              .attr('data-target', '#modal-form')
              .trigger('click');
    } else {
       console.log("error");
       $(this).addClass('btn-curso-error');
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="cidade-1256" class="col-sm-4 box-curso">
  <div class="plan">
    <div class="title">Brasília</div>
      <div class="description">
        <ul><li><button type="button" class="btn btn-curso active">AGO | 15 - 16</button></li></ul>
      </div>
      <button id="1256" class="btn btn-primary">ORDER NOW</button>
    </div>
  </div>
</div>

关于javascript - 多次触发('click')，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30737622/