javascript - onclick="" で直接 jQuery を実行すると、UI が遅くなります

Question

onclick=""のリンクで jQuery を作成するにはどうすればよいですか

たとえば、このようなものが必要です

<a onclick="jQuery:$('this').hide('slow')" href="#">Close</a>

私はこれが古典的なJavaScriptでどのように行われるかを知っていますが、効果が遅いためにjqueryでこれが必要です

Answer 1

<a>タグとは別にイベントをバインドします。これを試して：

$(document).ready(function () {
    $("a.close").on("click", function (e) {
        e.preventDefault();
        $(this).hide("slow");
    });
});

このHTMLで：

<a href="#" class="close">Close</a>

デモ: http://jsfiddle.net/rp3PZ/

これらの要素が動的に追加される場合、次のようにイベント委任を使用できます。

$(document).on("click", "a.close", function (e) {
    e.preventDefault();
    $(this).hide("slow");
});

デモ: http://jsfiddle.net/zvTer/

を使用する代わりにdocument、より近い静的コンテナ要素を使用する必要があります。その場合も$(document).ready、上記のように使用する必要があります。

---

コメントによると、この近いアンカーは、クラス「contentbox」を持つコンテナーにネストされているようです。アンカーがクリックされたときにこのコンテナーを非表示にするには、 を使用できます$(this).closest(".contentbox").hide("slow");。例を次に示します: http://jsfiddle.net/rp3PZ/1/