如果表单字段没有被修改,如何在jQuery中禁用提交按钮?

时间:2009-05-19 05:52:27

标签: jquery html forms form-submit

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

我希望只有在修改字段内容时才启用提交按钮。现在这里是catch:如果用户将字段内容修改回原始值,则应再次禁用表单按钮。

  1. 原始字段值“foo”=>提交按钮已停用
  2. 用户将字段值更改为“bar”=>提交按钮已启用
  3. 用户将字段值更改回“foo”=>提交按钮再次被禁用
  4. 如何使用jQuery实现此目标?我可以使用任何形式的任何通用解决方案或脚本吗?

    编辑:我要问的是简单的脏状态跟踪无法完成。

8 个答案:

答案 0 :(得分: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 - 表示控件值已更改的布尔值

答案 1 :(得分:2)

只需两步:

  1. 将所有初始值的哈希值存储在javascript变量
  2. 每次输入的onchange重新计算该哈希并使用存储的哈希验证它。如果它是相同的,请禁用提交按钮,如果不是,则启用它。

答案 2 :(得分:1)

答案 3 :(得分:1)

答案 4 :(得分: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());
    });
});

* - 矛

答案 5 :(得分:0)

应该可以保存整个表单对象(无论是原样,还是通过迭代使用.each()并将数据存储在映射中),然后执行相同的onSubmit并比较两个值。

答案 6 :(得分:0)

您可以使用dirtyField插件代替并设置denoteDirtyForm:true。现在,如果你的表格有" dirtyForm" class表示您有未保存的更改。

答案 7 :(得分:0)

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