0

innerHTML 経由でいくつかのコンテンツを読み込んでいます。

    $('#load-text-button').click(function () {
         document.getElementById("text-area").innerHTML="Some text <span class="footnote">The Footnote</span> Some other text.
    });

「bold-footnote-button」がクリックされたときに、新しく作成されたスパン (「footnote」のクラス) にアクセスしたいと考えています。ドキュメントの読み込み時に脚注ボタンが読み込まれましたが、DOM が読み込まれた後にテキストが読み込まれました。

    $('#bold-footnote-button').click(function () {
        $(".footnote").addClass('bold');
    });

「.footnote」要素が見つかりません。私が読んだものはすべて .live メソッドの使用を指していますが、ドキュメントによると、現在は非推奨になっています。直接クリックせずに新しい「.footnote」要素にアクセスするにはどうすればよいですか?

4

2 に答える 2

1

新しく挿入された要素をイベント ハンドラーでターゲットにするのではなく、イベント ハンドラー内でターゲットにするため、クリック機能は正常に動作するはずです。問題は、引用に問題があるため、おそらくそのような要素が挿入されなかったことです。次のようにします。

$('#load-text-button').click(function () {
    $("#text-area").html('Some text <span class="footnote">The Footnote</span> Some other text.');
});
于 2013-02-24T18:48:09.740 に答える
0

多分私は何かが欠けているかもしれませんが、$(".footnote") を要求するときに最初の click() で html を変更すると、新しく作成されたスパンが見つかるはずです。DOM の変更と DOM クエリの間の遅延に問題がある場合がありますが、これらの問題は、ステートメントが次々にある場合にのみ発生します。あなたの場合、ユーザーが #bold-footnote-button に移動している間、ブラウザーは常に更新されます。おそらく問題は、最初の例で文字列とクラス属性に二重引用符を使用していることです。

クラス属性が正しく取得されているかどうか、ブラウザ開発ツールで確認してください

于 2013-02-24T18:50:44.783 に答える