Question

我在fieldset内有DHTML内容。这包括纯HTML，嵌套对象（甚至其他字段集）以及input，select和textarea对象的值更改。

如果内容已更改，我想更改字段集的边框。以下作品：

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

这处理输入;我可以将它扩展到select和textarea。

问题：

如何对html更改执行相同的操作？
是否可以通过将当前的html（）与存储的html（）进行比较来完成所有这些变更跟踪？
如果是（2），是否会处理“撤消”的情况？

编辑：我有一个ajax上传内容的按钮，并保存更改。然后我删除边框颜色

Answer 1

1。）您可以采用与jQuery livequery plugin类似的方式跟踪HTML更改。 livequery插件包装了所有jQuery DOM操作方法，当调用它们中的任何一个时，包装器方法执行一些特殊操作，然后代理回原始函数。这只适用于更新/撤消用例，假设两者都使用jQuery DOM操作方法之一来改变状态。

$.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（）的值存储在字段集中，那么它似乎也适用于撤销情况。您也可以在撤消后比较html（）的值。但是，如果你正在创建一个“撤销”按钮，在我看来你需要有一些所有更改的历史记录，一旦用户没有更多的撤消，那么他们应该回到原始状态并且没有比较html（）应该是需要的。

通过父级显示内容更改

1 个答案: