2

初めての投稿なのでお手柔らかに。:)

私のページにリンクがあります。

リンクをクリックしたときに新しいdivを作成したい。

新しい div には、この div の作成に使用したものと同じリンクを含める必要があります。これにより、同じリンクを含む新しい div を引き続き作成できます。

これが私のコードです:

<script type="text/javascript">

    $(document).ready(searchCriteria);
    $(document).ready(loadSearchCriteria);

    function searchCriteria() {
        $(".test").load("searchCriteria.html");
    }

    function loadSearchCriteria() {
        $(".test1234").click(function () {
            $(".test1234").load("searchCriteria.html");
            function loadNewClick() {
                var $newClick = $('<div class="test1234"></div>');
                    $(".content").append($newClick);
            }
        });
    };

</script>

jquery-1.4.2.min.js を使用しています

私はjqueryが初めてなので、ヒントをいただければ幸いです。どうも :)

4

3 に答える 3

0

これを試して:

$(function() {
    //document ready
    $(".test").load("searchCriteria.html");
    var $newClick = $('<div class="test1234">Sample div</div>');
    $(".content").append($newClick);
    $($newClick).live("click", function() {
        $(this).load("searchCriteria.html");
    });
});​
于 2012-12-10T14:15:12.457 に答える
0

では、これらの新しく追加された .test1234 要素のそれぞれに同じクリック イベントを持たせたいですか? クリックイベントをクラス.on()委任するために使用できます。これにより、新しいクラスまたは古いクラスを取得するものに効果的にバインドされます (最近のバージョンの jQuery では.on()置き換えられます)。.live()


しかし、委任されたイベントには (適度な) オーバーヘッドがあり、このような単純なものには過剰かもしれません。新しい要素を作成するときに、それを作成した関数をそれにバインドできます。このように新しく作成された要素にイベントをバインドすることは、便利な「あまり知られていない」jQuery のトリックです。

重要な点は次のとおりです。次のように、新しい div を作成する関数を新しく作成された div にバインドします (読みやすくするために新しい行をクリックします)。

 function somefunction() {
   var $newClick = $('<div class="test1234"></div>')
     .click( somefunction );
   $(".content").append($newClick);
 }

( を使用することも.click(function() { some code })、 として書くこともできますが$('<div/>').addClass('test1234').click( somefunction );、非常に柔軟です)

今回はそれをテストしました:)そして、ここに完全なコードを示すjsfiddleがあります(..text().load()

コメントで言及した問題は、コードの構造に関する別の問題だと思います.jsfiddleコードの変更とコメントを見て、いつ何が起こっているかを考えてください.

物事を変更し、壊して、意味がわかるまでリロードしてください:)。



ある JavaScript コーディング デザイナーから別のデザイナーへの親切なヒント - 実際のプログラミングを学習する上で最も難しいことは、タイミングと可動部分 (各ポイントでの各要素とは何か) を把握することです。jQueryでは、イベントを.click() バインドするclick()などのことを覚えておいてください (は の単なるショートカットですbind('click'))。(and etc など).bind('click)の代わりに使用することを学んでいるときに役立つことがわかったので、コードを読み返すときに、何がいつ、何が起こっているのかを正確に把握することが常に直感的でした。.click()bind('mouseover')

また、console.log()たくさん使います。すべてをログに記録し、何がどの時点でどのような結果になるかを監視します。そして、テキスト エディター/jsfiddle/firebug などを、何かがうまくいかないときに教えてくれる無限に大きなスケッチブックと考えてください。それは学ぶための最良の方法です。

于 2012-12-10T14:25:40.090 に答える
0

$(".test").load("searchCriteria.html");完了したらloadNewClick を呼び出す必要があります

$(".test").load("searchCriteria.html", function(){
    alert('completed');
    //EDIT:: this is your load new click function
    var $newClick = $('<div class="test1234"></div>');
    $(".content").append($newClick);
});
于 2012-12-10T14:07:20.800 に答える