3

Smooth Div Scrollと呼ばれる jQuery プラグイン (jQuery UI ウィジェット) に取り組んでおり、ページ上のプラグインの個々のインスタンスに固有の間隔への参照を保存する必要があります。私がこのようなものを書くだけなら:

var myInterval = setInterval(関数() {  
    alert("こんにちは!");  
}、100);

...変数myIntervalは実際にはwindow.myIntervalになり、ページ上のプラグインのすべてのインスタンスで共有されます。したがって、インスタンスの間隔を設定またはクリアしようとすると、すべてのインスタンスが同じウィンドウ変数を参照しているため、すべてのインスタンスの間隔が設定/クリアされます。

jQuery API を調べると、プラグインの各インスタンスには対応する DOM 要素があるため、一致した要素に関連付けられた任意のデータを格納するために使用されるメソッド.dataが見つかりました。完全！このメソッドを使用して、一致した要素に固有のデータを保存できます。したがって、コードを次のように構成しました (ここで、el は一致した要素への参照です)。

el.data("myInterval", setInterval(関数() {  
    alert("こんにちは!");  
}、100));

プラグインの異なるインスタンスが同じ変数 (間隔) を参照しなくなるため、これはある程度機能します。しかし、プラグインのインスタンスが 2 ～ 3 個あるページがあり、各インスタンスに同じ間隔を設定すると、最初のインスタンスだけがその間隔を開始することに気付きました。ただし、間隔のタイマーが小さい場合、一部の要素のみが間隔を開始します。

実際の値を深く掘り下げることはしていませんが、1 つのページにプラグインの 3 つのインスタンスがあり、次のように間隔が 5 に設定されている場合:

el.data("myInterval", setInterval(関数() {  
    alert("こんにちは!");  
}、5））;

...最初のインスタンスのみが開始されます。20 ～ 30 に増やすと 2 つのインスタンスが起動し、さらにたとえば 50 に増やすと 3 つのインスタンスすべてが起動します。これはとても奇妙ですか？

私の質問は次のとおりです。

(.data を使用して) 間隔への参照を保存することは良い考えですか? もしそうなら、失敗した間隔の原因は何ですか?

これで私を助けてください - 私は困惑しています! 実際のソース コードが必要な場合は、プラグイン ページ (この投稿の上部にあるリンク) をチェックしてください。

/トーマス・カーン

4

2 に答える 2

1

setInterval と setTimeout の戻り値は、タイムアウトを参照するために内部で使用される単なる整数であるため、整数を .data に格納しても問題ありません。

于 2010-08-03T18:31:54.667 に答える
0

コードを詳しく調べて少し調べたところ、問題は el.data の間隔の保存に関連していないようです。間隔は問題なく保存されます。この問題は、コード内で間違った順序で実行されているルーチンに関連していると思われます。正しい順序は次のとおりです。

  1. jQuery の load() を使用して、HTML コンテンツ (画像) のチャンクを読み込みます。
  2. これらすべての要素の合計幅を計算します。
  3. これらの画像をスクロールする間隔を開始します。

問題は、すべての要素の合計幅を計算するルーチンが、jQuery ロードを使用して AJAX を介してコンテンツがロードされる前/同時にトリガーされることです。その結果、読み込まれた要素の計算された合計幅は 0 (ゼロ) になり、幅がゼロのものをスクロールしても意味がないため、スクロール ルーチンは停止します。

于 2010-08-04T09:29:00.080 に答える