jQueryウィジェットではなく、私はそれらがどれだと思いましたか？

Question

jQueryウィジェットはDOMオブジェクトに手軽にリンクされたjQueryオブジェクトだと思っています（たとえば、状態を保存したり、イベントを処理することができます）が、インスタンスモデルを理解する上で問題があります。私はそのようなオブジェクトを持っています。

var xs_widgets = { 

    jQuery : $, 

    options: { }, 

    _create: function() { 
     this.make_sortable() ; 
    }, 

    _init: function() { alert ('init') ; } 

    make_sortable: function() { alert ('make-sortable') ; } 
} 

これをjQueryにバインドします。

jQuery.widget("ui.xs_widgets", xs_widgets); 

次に、いくつかのDOM要素をウィジェットにバインドしようとします。

$('li.widget').xs_widgets(); 

ここが問題です。私はと答えましたそれぞれ<li class="widget">にはjQueryオブジェクトが添付されていますが、私が収集できるものは関係なく、グローバルなxs_widgetオブジェクトがあり、上記のクエリからjQueryオブジェクトを取得しています。ウィジェットの要点は、インスタンスを扱う際のオーバーヘッドを避けることだと思いましたか？上記のコードは、例えば2つの<li>要素を含むHTMLに対して実行されます。

make-sortable 
init 
make-sortable 
init 

私は期待していました。

make-sortable 
init 
init 

ああ、助けてください！私はチュートリアルや記事を読んでいますが、どこかで何か重要なものが欠けているようです。

Answer 1

xs_widgets関数ウィジェットは、セレクタ内の一致する要素ごとに1回呼び出されます（したがって、2つのタグで2回呼び出されます）。

それぞれにjQueryオブジェクトが添付されていると考えました。

があります。これは、なぜ_createと_initが両方とも2回呼び出される理由です。ただし、createメソッドは、ウィジェットを要素に追加するときに一度だけ呼び出されます。あなたは右のあなたの最初の呼び出し後に再度$('li.widget').xs_widgets();を呼び出した場合、あなただけ取得します：

のinit
のinit

Here's an example.