0

内にDHTMLコンテンツがありfieldsetます。これには、プレーンhtml、ネストされたオブジェクト（他のフィールドセットも含む）、および、、およびオブジェクトの値の変更が含まinputれselectますtextarea。

内容が変更された場合、フィールドセットの境界線を変更したいのですが。次の作品：

$('fieldset[name=qsfs127]').children('input').change(function(){
    $(this).parent('fieldset').css({border:'1px solid red'});
})

これは入力を処理します。selectとtextareaに拡張できます。

質問：

  1. HTMLの変更に対して同じことを行うにはどうすればよいですか？
  2. この変更の追跡はすべて、現在のhtml（）を保存されているhtml（）と比較することで実行できますか？
  3. （2）が「はい」の場合、これは「元に戻る」の場合を処理しますか？

編集：コンテンツをajaxアップロードして変更を保存するボタンがあります。次に、境界線の色を削除します

4

1 に答える 1

0

1.）jQuerylivequeryプラグインと同様の方法でHTMLの変更を追跡できます。livequeryプラグインは、すべてのjQuery DOM操作メソッドをラップし、それらのいずれかが呼び出されると、ラッパーメソッドは特別な処理を実行してから、元の関数にプロキシします。これは、両方がjQueryDOM操作メソッドの1つを使用して状態を変更することを前提とした更新/元に戻すユースケースでのみ機能します。

$.each('append', 'prepend', 'after', 'before', 'wrap', 'attr', 'removeAttr', 'addClass', 'removeClass', 'toggleClass', 'empty', 'remove', 'html', function(i, funcName) {

   // Short-circuit if the method doesn't exist
   if (!$.fn[funcName]) return;

   // Save a reference to the original method
   var old = $.fn[funcName];

   // Create a new method
   $.fn[funcName] = function() {

      // Call the original method
      var r = old.apply(this, arguments);

      //Do something special here! Compare the stored html of the fieldset
      //to the new html state and update border accordingly

      // Return the original methods result
      return r;
   }
});

2.）この方法で追跡することができますが、少し手間がかかるようです。ユースケースとデータの管理に関する詳細情報がなければ、何かを推奨することは困難です。

3.）元のhtml（）の値をフィールドセットに保存した場合は、undoの場合にも機能するようです。元にした後のhtml（）の値を比較することもできます。ただし、「元に戻す」ボタンを作成している場合は、すべての変更の履歴が必要であるように思われます。ユーザーが元に戻すことがなくなると、元の状態に戻り、html（ ）が必要です。

于 2011-03-06T03:20:59.757 に答える