比较表单提交时的复选框选中状态与页面加载状态答案

【问题标题】：Comparing checkbox checked state versus page load state on form submit比较表单提交时的复选框选中状态与页面加载状态
【发布时间】：2016-08-08 06:17:19
【问题描述】：

我在页面和表单提交上有多个复选框，我希望不发送所有这些复选框进行处理，而只发送那些状态与页面加载时的状态相比发生变化的复选框。

例如，在页面加载时，复选框的原始状态已被选中。

然后用户点击同一个复选框 3 次，然后点击提交按钮：

第一次点击 - 状态更改为未选中
第二次点击 - 状态更改为选中
第三次点击 - 状态更改为未选中

那么有没有一种方法可以将第三次点击状态与页面加载状态进行比较？在这种情况下，我想发送该复选框数据，因为它的状态已经改变。另一方面，如果用户点击了两次，我不想将其发送给处理，因为它的状态在页面加载期间已经恢复到原来的状态。

【问题讨论】：

标签： javascript jquery html events event-handling

【解决方案1】：

当您提交一个 html 表单时，所有复选框都会被提交，除非它们具有“禁用”属性。

一种策略可能是添加一个包含复选框值的隐藏字段，并在提交时检查这两个，如果它们包含相同的值则禁用复选框。

【讨论】：

啊哈！好主意。我会看看是否有更好的方法来达到同样的效果，如果没有，我会接受你的答案。

【解决方案2】：

在这种情况下，您可以尝试这样的事情：

$(document).ready(function(){
   // get check box state at the time of page load
   if($('#chk1').is(':checked'))
   {
       var chkState1 = true;
   }
   else
   {
       var chkState1 = false;
   }

   $('#chk1').change(function(){
       // get new state of this check box and compare it with the old one. If its state is diff than put it in the ajax call otherwise not
   });
});

【讨论】：

如果我在页面上有静态数量的复选框，这将起作用。但是我的复选框是根据来自数据库的数据动态创建的。所以它不是固定数量的复选框。