1

我正在侦听 . 当我在单击链接时查看调试器中发生的事情时,它会在下面的 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会阻止它再次循环通过?

4

2 回答 2

0

问题是我在 HTML 头中引用了两个 contacts.js 文件。在 Rails 中,我复制了 contacts.js.coffee 文件并将其设为 contacts.js,但我没有删除原始的 contacts.js.coffee 文件。一旦我删除了第二个文件,它就可以与原始 JS 和 @Sander 的 JS 一起正常工作。

于 2012-11-21T17:53:11.107 回答
0

这是你需要的吗?

// 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");
});

请注意,我删除了 return false,因为 e.preventDefault() 也是如此

于 2012-11-21T15:07:47.067 回答