2

私は次のhtmlツリーを持っています：

<div class="section yellow" id="section1">
    <div id="content-wrap1" class="content-wrap">
</div>

私はajaxを使用して次のコンテンツをロードしています#content-wrap1：

<div id="content">
    <a href="whoweare.php">Who we are</a>
    <a href="whatwedo.php">Our team</a>
    <p>ABOUT US : Dance is a type of art</p>
</div>

これは正常に実行され、結果のHTMLは次のようになります。

<div class="section yellow" id="section1">
    <div id="content-wrap1" class="content-wrap">.
        <div id="content">
        <a href="whoweare.php">Who we are</a>
        <a href="whatwedo.php">Our team</a>
        <p>ABOUT US : Dance is a type of art</p>
    </div>
</div>

次に、動的にロードされたリンクをクリックして、次のコンテンツをロードします。

<div id="content">
    <a href="whoweare.php">Who we are</a>
    <a href="whatwedo.php">Our team</a>
    <p>Hi there! How are you?</p>
</div>

最終的なHTMLは次のようになります。

<div class="section yellow" id="section1">
    <div id="content-wrap1" class="content-wrap">.
        <div id="content">
        <a href="whoweare.php">Who we are</a>
        <a href="whatwedo.php">Our team</a>
        <p>Hi there! How are you?</p>
    </div>
</div>

on()jqueryを動的にロードされたコンテンツにバインドするために使用する必要があると聞きました。だから私は次のことをします：

('#section1').on("click", "#section1#content-wrap1#content a", function(){
    alert("1");
    toLoad = $(this).attr('href')+' #content';
    $('content-wrap1').load(toLoad);
}

Ques1：これは正しい使い方on()ですか？リンクをクリックしalert 1ても画面に表示されず、ページは次の場所に移動するだけです。whoweare.php

Ques2：アラートを受け取ることができた場合、最初にクリックされたリンクを置き換えるコンテンツをロードするリンクを理論的にクリックすることは可能ですか？

4

2 に答える 2

7

Ques1：これはon（）の正しい使用法ですか？リンクをクリックしても、画面にアラート1が表示されず、ページがwhoweare.phpに移動するだけだからです。

コード

$(document).on("click", "#content a", function(){
        alert("1");
        toLoad = $(this).attr('href')+' #content';
        $('content-wrap1').load(toLoad);
})

Ques2：アラートを受け取ることができた場合、最初にクリックされたリンクを置き換えるコンテンツをロードするリンクを理論的にクリックすることは可能ですか？

于 2012-10-28T09:36:49.307 に答える
2

質問1

bindステートメントは次のようになります。

$(document).on("click", "#section1 #content-wrap1 #content a", function() {
    ...
});

動的またはその他の方法でロードされdocumentた2番目のセレクター（）に一致するすべての要素に対応するために、オブジェクトにバインドしていることに注意してください。#section1 #content-wrap1 #content a

また、2番目のセレクター（スペース）の修正に注意してください。

質問2

理論的には、最初にクリックされたリンクを置き換えるコンテンツをロードするリンクをクリックすることは可能ですか？

はい。完全に。

于 2012-10-28T09:35:22.990 に答える