奇怪的jQuery表单提交答案

【问题标题】：strange jquery form submit奇怪的jQuery表单提交
【发布时间】：2012-02-08 11:29:09
【问题描述】：

点击按钮会打开一个 div（表单）。该表单中有某些控件，例如时间字段、日期、文本框。当表单打开时，它会预先加载数据。表单的提交按钮（应用更改）也在那里。

如果我只是单击“应用更改”按钮而不更改表单中的任何内容，则不会发生任何操作，但如果我更改时间、日期或文本等任何内容，则表单将被保存。

我们如何定义这种行为？？

对语言的误解表示抱歉...

如果我只是单击“应用更改”按钮，我的表单不会被保存。在 jquery 中保存表单之前是否需要编辑其中一个控件？

【问题讨论】：

您是在问如何实现该行为，或者该行为的名称是什么？
@nnnnnnn：这种行为的名称是什么？

标签： jquery forms button submit

【解决方案1】：

您可以处理表单中所有控件的change 事件，当控件的值更改时（例如使用data()）在<form> 元素上设置一个标志，然后允许表单仅当设置了此标志时才提交：

$("form").on("change", ":input", function() {
    $(this).closest("form").data("someControlHasChanged", true);
}).on("submit", function(e) {
    if (!$(this).data("someControlHasChanged")) {
        e.preventDefault();
    }
});

【讨论】：

【解决方案2】：

这是跟踪表单数据更改的粗略方法：

function dealWithForm(){
  var hasChanged = false,
      $form = $('form');

  $('input, select', $form).on('change', function(){
    hasChanged = true;
  });

  $('form').submit(function(){
    if(hasChanged){
      $form.submit();
      // or post asynchronously with ajax    
      hasChanged = false;
      $.post( // blah blah );
    } else {
      // stop form from submitting.
      return false;    
    }
  });
}

$(document).ready(function(){
  dealWithForm();
});

【讨论】：

正是我想要的。即使控件未更改，也应保存表单。对上述内容进行一些修改将使我成功..谢谢@osahyoun

【解决方案3】：

不清楚您是想自动发布更改，还是希望在单击“应用更改”时发布更改。（但如果没有进行任何更改，则应用更改应该什么都不做。

最简单的方法是将旧值声明为 javascript 变量。向 applyChanges 添加一个 onclick 处理程序，它将每个旧值与当前表单值进行比较。如果有变化，请发布。

我能看到的唯一问题是“/”需要转义/未转义。更肮脏的解决方法/hack 是使用旧值生成不可见的 div。

并在那里生成旧字段。然后${oldFIeld1}.text() 检索它。请注意，这有点像黑客，也许其他人有一种微妙的方法来避免转义/取消转义。

【讨论】：