Javascript單擊偵聽器循環兩次

我正在偵聽點擊鏈接中的鏈接。點擊鏈接時，當我觀察調試器中發生的情況時，它會在兩次以下循環播放Javascript。這意味着它似乎什麼都不做，但它是第一次工作，只是第二次撤消。Javascript單擊偵聽器循環兩次

這裏的JavaScript的問題：

$("#list a").click(function(e) { 
    var id = $(e.currentTarget).attr("id"); 
    $("div#edit_due_at_"+id).toggleClass("hidden"); 
    $("span.due_"+id).toggleClass("hidden"); 
    $(this).addClass("hidden"); 
    e.preventDefault(); 
    return false 
});

和HTML：

 <ul id="list"> 
     <li class="up" id="32"> 
      <span class="cname ">sally and eddie</span> 
      <br> 
      <span class="time-ago">Added 6 days ago.</span><br> 
       <span class="time-ago"> 
       <a href="#" id="32">add due date</a> 

       </span> 
      <form accept-charset="UTF-8" action="/contacts/32" class="edit_contact" id="edit_contact_32" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="_method" type="hidden" value="put" /><input name="authenticity_token" type="hidden" value="dwUgdONDp1TWL6zpdI1+UYvcy3KvIxWUIoRiqMwJklY=" /></div> 
        <input id="contact_done" name="contact[done]" type="hidden" value="true" /> 
      <input id="contact_date_done" name="contact[date_done]" type="hidden" value="2012-11-21" /> 
        <input class="btn btn-small hidden done_btn" name="commit" type="submit" value="Mark as done" /> 
</form>  </li> 
     <li class="up" id="33"> 
      <span class="cname ">adding a contact for next Monday</span> 
      <br> 
      <span class="time-ago">Added 5 days ago.</span><br> 
       <span class="time-ago"> 
       <a href="#" id="33">add due date</a> 

       </span> 
      <form accept-charset="UTF-8" action="/contacts/33" class="edit_contact" id="edit_contact_33" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /><input name="_method" type="hidden" value="put" /><input name="authenticity_token" type="hidden" value="dwUgdONDp1TWL6zpdI1+UYvcy3KvIxWUIoRiqMwJklY=" /></div> 
        <input id="contact_done" name="contact[done]" type="hidden" value="true" /> 
      <input id="contact_date_done" name="contact[date_done]" type="hidden" value="2012-11-21" /> 
        <input class="btn btn-small hidden done_btn" name="commit" type="submit" value="Mark as done" /> 
</form>  </li>........</ul>

我認爲return false將從通過再次循環停止嗎？

來源

2012-11-21 kwh941

返回false可防止原始事件被觸發。所以在這種情況下，它不會遵循的鏈接。 – sroes

的問題是，我有兩個contacts.js文件的HTML頭部被引用。在rails中，我複製了contacts.js.coffee文件，並將它創建爲contacts.js，但我沒有刪除原始的contacts.js.coffee文件。一旦我刪除了第二個文件，它就可以很好地處理@Sander原來的JS和JS。

來源

2012-11-21 17:53:11 kwh941

這是你所需要的？

// add a custom click handler 
$("#list a").on("click.myHandler", function(e) { 
    e.preventDefault(); 
    var id = $(e.currentTarget).attr("id"); 
    $("div#edit_due_at_"+id).toggleClass("hidden"); 
    $("span.due_"+id).toggleClass("hidden"); 
    $(this).addClass("hidden"); 
    // remove the custom click handler 
    $(this).off("click.myHandler"); 
});

通知我刪除返回FALSE，因爲e.preventDefault（）做了同樣的

來源

2012-11-21 15:07:47 sroes

這也行不通。它仍然通過該功能循環兩次。 – kwh941

Javascript單擊偵聽器循環兩次

回答

相關問題