1

内のリンクのクリックをリッスンしています。リンクをクリックしてデバッガーで何が起こっているかを見ると、以下のJavascriptが2回循環しています。これは、何もしていないように見えることを意味しますが、最初は機能しており、2回目は元に戻されています。

問題の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

これはあなたが必要なものですか？

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

e.preventDefault（）が同じことを行うため、returnfalseを削除したことに注意してください

于 2012-11-21T15:07:47.067 に答える
0

問題は、HTMLヘッドで2つのcontacts.jsファイルが参照されていることでした。Railsでcontacts.js.coffeeファイルをコピーしてcontacts.jsにしましたが、元のcontacts.js.coffeeファイルは削除しませんでした。2番目のファイルを削除すると、元のJSと@SanderのJSで正常に機能しました。

于 2012-11-21T17:53:11.107 に答える