0

次のような匿名のjQuery関数があります。

( function( $ ) {

    "use strict";

    var CHEF = window.CHEF || {};

    CHEF.fancyTitler = function() {
        if( $( '.k-fancy-title' ).length ) {
            $( '.k-fancy-title' ).wrap( '<div class="k-fancy-title-wrap" />' );
        }

    }
    // + a bunch of other functions inside

    $( document ).ready( function() {
        CHEF.fancyTitler();
        // + a bunch of other function inits
    } );

} )(jQuery);

...次に、AJAX を使用してページにコンテンツを読み込みます。コンテンツの読み込みに関してはすべて問題.k-fancy-titleありませんが、要素はラップされません。ajaxでロードされたコンテンツをDIV（.k-fancy-title-wrap ）でラップするために、匿名関数をリロード/再呼び出し/何でもする必要があることは明らかです。

それ、どうやったら出来るの？

4

2 に答える 2

1

成功ハンドラーを ajax 呼び出しから変更したくない場合は、jQuery のグローバルな ajax 成功イベントであるajaxCompleteをバインドできます。

$(document).ajaxComplete(function() {
    chef.fancyTitler();
});

fancyTitlerただし、すでにラップされている要素を再ラップしないようにメソッドを変更する必要があります。

このようなもの

CHEF.fancyTitler = function() {
    $('.k-fancy-title').each(function(){
        var el = $(this);
        if(!el.parents('.k-fancy-title-wrap').length)
        {
            el.wrap('<div class="k-fancy-title-wrap" />');
        }
    });
}

また、これらの要素を追加する ajax 呼び出しの成功ステートメントを単純に変更することをお勧めします。そうしないと、任意の ajax 呼び出しで fancyTitler を呼び出すことになります。

于 2013-09-30T15:08:23.847 に答える
0

私が正しく理解している場合、問題は、AJAX (javascript ではなく、一部の html コンテンツ) を使用して一部のコンテンツをロードし、クラスの要素がk-fancy-title既にロードされている javascript によって取得されないことですか?

最初にページをロードするとき、およびドキュメントの準備ができたら、fancyTitler() 関数を起動します ( CHEF.fancyTitler())。しかし、他のコンテンツをロードするとき、新しい DOM 要素 (ドキュメントで ready イベントが発生したときには存在していなかった) に対して、スクリプト内の何もそれを再度呼び出すことはありません。したがってafter、新しい ajax コンテンツが読み込まれるので、その関数を再度起動する必要があります。次のようなもの：

$.get('/path/to/the/content', function() {
    // inside success function
    CHEF.fancyTitler();
});
于 2013-09-30T15:10:27.513 に答える