$ (document) .ready (function() {} jquery получает вызов дважды?

Question

Im new to jquery..Я написал функцию jquery для обработки некоторых входных данных формы. Я вижу странную проблему, которую вызывает мой $(document).ready(function(){} . дважды

Моя форма;

<form> 
........... 
     <div class="form-actions" id="saveButtons"> 
        <button class="btn btn-primary" /><%=i18n.localize("save")%></button> 
        <%if(outputs.isPermitted){%><script> </script><a class="btn btn-info" id="publish_api" >Save & Publish</a> <%}%> 
        <input type="reset" class="btn" value="<%=i18n.localize("cancel")%>" onclick="javascript:window.location.href='./'" />           
       </div> 
      </form> 

И JQuery есть;.

<script> 
    $(document).ready(function(){ 


    $('#publish_api').click(function(e){ 
     $("body").on("api_saved", function(e){ 
      $.ajax({ 
       ........ 
     }); 
     $("#manage_form").submit(); 
    }); 

</script> 

я вижу выше предупреждение дважды, когда я нажимаю кнопку save and publish Эта проблема возникает, если какой-либо ошибка пользователя при заполнении формы. (То есть, если пользователь не заполняет поле MUST и не работает, если он заполнил эту запись и попытался нажать кнопку). В чем причина?

Редактировать; Обработчик события «api-saved» вызывается из javascript; (Для проверки всех Params в этой форме)

var v = $("#manage_form").validate({ 
     submitHandler: function(form) { 
     if(!validate_tiers()){ 
      return false; 
     } 

     $('#saveMessage').show(); 
     $('#saveButtons').hide();   
     $(form).ajaxSubmit({ 
      success:function(responseText, statusText, xhr, $form) { 
       $('#saveMessage').hide(); 
       $('#saveButtons').show();     
       if (!responseText.error) {     
        $("body").trigger("api_saved");  
       } else { 
......... 

} 

Answer 1

Вы вложенности назначение обработчика события, которое обычно ошибка. У вас есть:

$('#publish_api').click(function(e){ 

, который устанавливает обработчик для события «click» от элемента. Внутри этого обработчика событий это код, который устанавливает другой обработчик события:

$("body").on("api_saved", function(e){ 
     alert("calling lifecycle jag"); 
     // ... 

Причина, по которой, вероятно, будет ошибкой является то, что каждый вызов .on() внутри «щелчок» обработчик присоединит отдельную копию этого события обработчик. После двойного щелчка будет два идентичных обработчика для события «api_saved». После нажатия 5 раз будет 5 обработчиков и так далее. Это происходит потому, что вызов .on() делает не удаляет обработчики событий, которые уже зарегистрированы.

Возможно, правильное решение - переместить назначение обработчика события (одно для «api_saved») из обработчика «щелчка».