2

我有一个包含文本字段、复选框、单选按钮和提交按钮的 HTML 表单。

我希望仅在修改字段内容时启用提交按钮。现在要注意了：如果用户将字段内容修改回原始值，则应再次禁用表单按钮。

  1. 原始字段值“foo”=> 提交按钮被禁用
  2. 用户将字段值更改为“栏”=> 提交按钮变为启用状态
  3. 用户将字段值更改回“foo” => 提交按钮再次被禁用

如何用jQuery实现这一点？是否有任何通用解决方案或脚本可以用于任何形式？

编辑：我的要求不能通过简单的脏状态跟踪来完成。

4

8 回答 8

4

使用脏状态跟踪。为每个输入控件附加一个布尔值（例如 IsDirty），并在值更改时切换它。在提交表单时检查是否至少一个或多个值发生了变化，然后提交表单。否则向用户显示警报。

另一种解决方案是在控件值更改时调用通用函数。在此函数中，如果发生更改，您可以将全局变量 (IsDirty) 设置为 true，还可以启用/禁用提交按钮。

var isDirty = false;

function SomethingChanged(){
     if( !isDirty ) isDirty = true;
     btnSubmit.disabled = !isDirty;
}

任何控件的通用函数

假设：将每个控件的初始值添加到属性“InitVal”

function SomethingChanged(control){
     if( control.value != control.InitVal )
          control.IsDirty = true;
     else
          control.IsDirty = false;
}

在上面的函数中，为了使其通用，您可以为每种类型的控件设置单独的函数，例如 TextBoxChanged 和 DropDownChanged 等。但是每个控件都有以下两个属性

  1. InitValue - 控件的初始值
  2. IsDirty - 指示控件值已更改的布尔值
于 2009-05-19T06:00:19.500 回答
2

只需两步：

  1. 将所有初始值的散列存储在 javascript 变量中
  2. 每个输入的 onchange 都会重新计算该散列并使用存储的散列对其进行验证。如果相同，禁用提交按钮，如果不是，启用它。
于 2009-05-19T09:44:24.983 回答
1

看看验证插件。

于 2009-05-19T06:01:38.360 回答
1

这似乎是一个更好的答案。

1401-使用-jQuery-To-Leverage-The-OnChange-Method-Of-Inputs.htm

于 2009-08-28T13:39:57.870 回答
0

我还没有测试过下面的内容:-) 但这是你的意思吗？

$(document).ready(function() {
    $("#myform :input").attr("init",$(this).val()).bind("change.dirty", function(evt) {
        if ($(this).val()!=$(this).attr("init")) $(this).addClass("dirty");
        else $(this).removeClass("dirty");
        $('#thebutton').attr("disabled",!$("#myform .dirty").size());
    });
});

*-派克

于 2010-07-21T22:35:41.490 回答
0

应该可以保存整个表单对象（按原样保存，或者通过迭代 .each() 并将数据存储在地图中），然后执行相同的 onSubmit 并比较两个值。

于 2010-08-25T16:00:08.880 回答
0

您可以改用dirtyField插件并设置denoteDirtyForm: true。现在，如果您的表单具有“dirtyForm”类，则意味着您有未保存的更改。

于 2012-12-14T07:23:51.237 回答
0

您可以做的是设置一个 jquery 脚本以在页面加载时扫描页面并检查表单，清点字段及其值，然后在更新输入时检查该输入引用数组。

于 2014-09-10T14:23:24.177 回答