0

我有一个表格，我想跟踪任何更改。现在我已经设置好了，所以当用户退出页面时，会显示一个警告框，说明对表单进行了多少更改。但是，它一直注册为 0。我已经测试了向 inputChanges 函数添加警报，告诉我发生了更改并且警报触发，但是当我退出页面时计数仍然注册为 0...

这是我的脚本：

window.onload = function() {
    var totalChanges = "";
    var inputHandles = 0;
    var selectHandles = 0;
    var textAreaHandles = 0;

window.onbeforeunload = function(){
    alert("Total Form Changes:" + totalChanges);
}//onbeforeunload

   var totalChanges = inputHandles + selectHandles + textAreaHandles;

   function inputChanges() {
   inputHandles++; 
   alert("Change");
   }

   var inputs = document.getElementsByTagName("input"); 
   for (i = 0; i < inputs.length; i++){
    inputs[i].onchange = inputChanges;
   }    

   function selectChanges(){
   selectHandles++;
   }

   var selects = document.getElementsByTagName("select");
   for (i = 0; i < selects.length; i++){
   selects[i].onselect = selectChanges;
  }

  function textAreaChanges(){
   textAreaHandles++;
  }

   var textAreas = document.getElementsByTagName("textarea");
  for (i = 0; i < textAreas.length; i++){
   textAreas[i].onchange = textAreaChanges;
  }
}//Onload
4

2 回答 2

2

您totalChanges在这里声明：

var totalChanges = "";

...然后在这里重新声明：

var totalChanges = inputHandles + selectHandles + textAreaHandles;

...此时你加起来的东西都是0.

您需要在需要值的地方进行计算：

window.onbeforeunload = function(){
    totalChanges = inputHandles + selectHandles + textAreaHandles;
    alert("Total Form Changes:" + totalChanges);
}

或者totalChanges = 0最初设置，然后在每次其他变量更改时增加它，但这更笨重。

另请注意，您不是在计算现在值与其起始值不同的字段的数量，而是在计算单个编辑的数量。因此，如果用户两次更改一个字段，而第二次更改为原始值，您的代码将跟踪该字段作为两次更改（从逻辑上讲，它是零更改）。

于 2013-08-04T04:24:26.037 回答
0

由于用户可以将值更改回原来的值，我建议您将所有值进行比较input.value并input.defaultValue检查select.options[select.selectedIndex]defaultSelected

您也可能希望将 } 和警报移动到总更改总和之后

像这样的东西

window.onload = function() {
  var totalChanges = 0;


  window.onbeforeunload = function(){
    var inputs = document.getElementsByTagName("input"); // ditto for "textarea"
    for (var i = 0; i < inputs.length; i++){
      totaChanges +=  inputs[i].value != inputs[i].defaultValue;
    }    
    var selects = document.getElementsByTagName("select");
    for (var i = 0; i < selects.length; i++){
      totalChanges += !selects[i].defaultSelected;
   }

    alert("Total Form Changes:" + totalChanges);
  }//onbeforeunload
}
于 2013-08-04T04:24:41.870 回答