8

これは具体的な質問というよりも戦略的な質問ですが、正確に質問されていると思いますので、以下に示します。

3 つのセクションに分かれたページまたはアプリがあるとします。フォームの一部を変更すると、サーバーに ajax ポストが送信されます。これには、セクション 2 の変更が必要です。セクション 2 の再処理された HTML 出力を送り返し、セクション 2 の元の状態を置き換えたい

しかし、セクション 2 には、変更、クリック、ドラッグなどのバインディングを持つ多くの要素があります。経験から、html 置換を行うと、すべてのバインディングが失われます。

ただし、これにより、バインディングを失わないように、セクション 2 の多くの要素の特定の内容を個別に書き直す必要があります。

これにはもっと簡単なアプローチがあることは知っていますが、よくある問題のようです。この質問の「ああ」の部分と、おそらくいくつかの例やリンクを教えてもらえますか? ほんとうにありがとう。

4

2 に答える 2

7

問題を 2 つのセクションに分割する必要があります。

イベントの処理これは、 $.on()
を使用したイベント委任を使用して実行できます。つまり、要素にイベントを登録する代わりに、削除されない親に登録します 例:

$('.container').on('click', 'a', function(){
    //do something
})

ドラッグ可能なようなウィジェットの処理
ここでは、新しい dom 要素が追加されたら、これらのウィジェットを再初期化する以外に方法がないため、運が悪いと思います。
例:

var ct = $('.container').html('');
ct.find('li').draggable({})
于 2013-05-17T04:08:00.247 に答える
6

Event Delegationを使用できるため、再バインドする必要はありません。

于 2013-05-17T04:04:05.060 に答える