2

由于 Javascript 性能可能会在大型输入表单上变得密集，那么跟踪和标记输入字段更改的最简洁和最快的方法是什么？

该项目使用 .NET (MVC)，输入绑定到 ViewModel，但这可能（至少是半）无关紧要。如果可能有几千个字段和许多隐藏的输入字段（通常数量较少，但在某些情况下可能有几千个），我主要关心的是避免性能问题。有下拉菜单、文本字段、复选框等。

具有各种输入类型的长表单。

<input type="... textbox/select..." class="trackMe" ... />
<input type="hidden" class="hiddenInputIsDirty" ... />

想到的选项。

不显眼：

$( ".trackMe" ).on( "change", function() {
    $(this).sibling("#hiddenInputIsDirty").val("true");
});

或者

或者onClick="Observe.MarkChanged();"在输入上使用。

(function( Observe, $, undefined ) {        
    //Public Method
    Observe.MarkChanged = function() {
        $(this).sibling("#hiddenInputIsDirty").val("true")
    };        
}( window.Observe= window.Observe|| {}, jQuery ));

澄清一下：每个可见的输入字段都会有一个隐藏的输入字段来标记。当用户更改输入字段值时，它会触发一些东西来将隐藏字段标记为已更改。我认为这是跟踪更改的最快和最可靠的方法。是否已知其中一种方法更快，或者是否有更快的替代方法？

4

3 回答 3

3

您可以使用MVVM 模式。

我会推荐淘汰赛。

于 2013-10-22T08:03:09.217 回答
2

您可以立即使用的一种简单方法是使用一个对象来保存您的跟踪，而不是使用多个隐藏输入。多个隐藏输入只会使您的表单元素加倍并减慢速度。稍后您可以学习并转移到图书馆，这些图书馆将为您提供开箱即用的所有内容。

像这样的东西：

// initialize at the start
var tracker = new Object;

$('input.formfield').each(function() {
    tracker[$(this).attr('id')] = false;
});

// and then later on

$(".track").on("change", function() {
    tracker[$(this).attr('id')] = true;
});

您首先使用与表单 input 相同的属性名称初始化对象id并将它们设置为 false。然后在进行任何更改时，只需翻转相应的属性。完成后，您可以简单地将这个对象传递给您的服务器端代码或在提交前检查。

检查这个小提琴：http: //jsfiddle.net/VbVyp/3/

是的，无论您使用什么库，数千个表单字段都可能不是一个好主意。实现像分页一样的向导。

于 2013-10-22T08:03:50.470 回答
-1

您可以查看以下 jquery 库来跟踪更改。 https://github.com/shashankshetty/FormChangeTracker

于 2015-05-06T09:47:33.730 回答