4

これは私のコードです：

    newS = "#newS_"+g; //g is a unique number from an id
    document.getElementById('finderScroll').innerHTML +='<div id="newS_'+g+'"></div>'
       $(newS).slider({
              range: true,
              min: 0,
              max: 500,
              values: [ 75, 300 ],
              slide: function( event, ui ) {
              console.log( ui.values[ 0 ] + ui.values[ 1 ] );
                 }
              });

新しいスライダーはそれぞれ機能しますが、別のスライダーを追加すると、以前のスライダーは機能しなくなります。各スライダーのすべてが一意であっても、ドラッグできなくなります。誰かがこれに対する解決策を知っていますか？

4

1 に答える 1

2

更新するinnerHTMLことで、基本的にブラウザーが DOM をゼロから再構築するようになります。appendChild代わりに、イベント ハンドラーと既存の要素に添付されたデータを保持するために使用します。

実際、次のように書けない理由がわかりません。

$('#finderScroll').append($('<div>').attr('id', 'newS_' + g));

...すでにjQueryを使用しているため。また、アサイナブロックも書き直すことをお勧めします。次のように記述できるため、作成された要素を探して DOM をトラバースする必要はありません ( を使用$(newsG))。

$('<div>').attr('id', 'news_' + g).slider({ ... })
    .appendTo($('#finderScroll'));
于 2012-12-21T15:48:04.003 に答える