0

私はこのシナリオを持っています。私のHTMLページでは、要素をクリックすると、 someとcontent を文字列としてaロードし、 aのコンテンツを ( 経由で) この新しいテキストに変更します。HTMLjQuerydivinnerHTML

jQueryコードは次のとおりです。

<script type="text/javascript">
    $("a.accessor").click(function(event) {
        var cId = this.id;
        $.get("/video/" + cId)
        .done(function(data){
            var contentDiv = document.getElementById("navigator");
            contentDiv.innerHTML = data;
        })
        .fail(function(data) {
            alert("An error occured during request. Please try again later!");
        });
    });
</script>

問題は、このjQueryコードを実行した後、新しいjQueryコード (これを置き換える) が応答しないことです。

ベローはHTML/jQuery私が得る新しいコードです:

<div class="breadcrumb">
    <a href="/video">Competitors</a>
    <span>&gt;</span>
    <a href="#">Name</a>
</div>
<div class="video-browser">
    @for(v <- competitor.getVideos()) {
        <div class="folder">
            <a id="@(competitor.getId())_@v.getId()" class="accessor">
                <img src="@routes.Assets.at("images/movie_file.png")" />
                <span>@v.getVideoName()</span>
            </a>
        </div>
}
<script type="text/javascript">
    $("a.accessor").click(function(event) {
        alert(123);
    });
</script>

オブス。簡潔にするために、使用するフレームワークに関連するコードをいくつか入れます。

上記のように、要素をクリックしようとすると何も得られませんHTML/jQuery。aなぜこれを説明できますか？

詳細が必要な場合は、私に尋ねてください。

前もって感謝します！

4

2 に答える 2

1

スクリプトをこれに変更します...

<script type="text/javascript">
    $("a.accessor").click(function(event) {
        var cId = this.id;
        $.get("/video/" + cId)
            .done(function(data){
                $("#navigator").html(data);
            })
            .fail(function(data) {
                alert("An error occured during request. Please try again later!");
            });
    });
</script>

jQuery のhtml()メソッドを使用して新しい html (およびスクリプト) を追加すると、以前に使用した方法とは異なり、スクリプトが実行されます。

于 2013-10-02T10:36:13.537 に答える
-1

これは、クリック イベント ハンドラが初期化されていないためです。これをドキュメント対応ブロックでラップする必要があります。でも...

<script type="text/javascript">
$(function(){
    $("a.accessor").click(function(event) {
        alert(123);
    });
});
</script>

タグがDOMにないため、どちらも機能しません。委任を使用することをお勧めします。これにより、将来追加されたときにも、.accessor 内のすべてのタグにクリック ハンドラーが追加されます。このコードをメインの html に配置します。

$(function(){
    $(".accessor").on('click', 'a',function(event) {
        alert(123);
    });
});
于 2013-10-02T10:32:59.577 に答える