Question

当我在javascript中使用form.reset（）时。该函数将表单重置为其原始状态。例如：

<form id="myForm">
  First name: <input type="text" name="fname" value="??"><br>
  Last name: <input type="text" name="lname"><br><br>
  <input type="button" onclick="myFunction()" value="Reset form">
</form>

<script>
function myFunction() {
    var form = document.getElementById("myForm");
    form.reset();
}
</script>

当我运行此代码时，第一个输入字段将被重置为“??” （这是原始值）。 javascript如何获得此值？我可以访问吗？

我正在建立一个网站，需要检查用户是否更改了表单的任何值。如果没有任何变化，我想阻止用户提交表单。这就是为什么我要问有什么方法可以用一般方法检查某个字段的当前值是否等于其原始值。

Answer 1

通过输入value =＆＃34;默认值＆＃34;设置输入元素的默认值。在元素本身，就像你在第一个元素中所做的那样。重置表单会将输入元素返回到其默认值。

要访问元素的默认值，您可以访问defaultValue属性。

JavaScript的：

document.getElementById('firstName').defaultValue;

jQuery（因为你在问题中标记了jQuery）：

$('#firstName')[0].defaultValue;

提交表单后，您可以根据默认表单值轻松检查当前表单值。

这是一个利用jQuery执行此操作的示例：

<强> HTML

<form id="myForm">
    <label for="firstName">First name:</label>
    <input id="firstName" type="text" name="fname" value="defaultval1" />
    <br />
    <label for="lastName">Last name:</label>
    <input id="lastName" type="text" name="lname" value="defaultval2" />
    <br />
    <br />
    <input id="btnSubmit" type="button" value="Submit" />
    <input id="btnReset" type="button" value="Reset" />
</form>

<强>的JavaScript

function hasAnythingChanged() {
    var hasChanged = false;
    $('#myForm :input[type=text]').each(function () {
        if (this.defaultValue != this.value) {
            hasChanged = true;
        }
    });
    return hasChanged;
}

$(function () {
    $('#btnReset').on('click', function () {
        var form = document.getElementById("myForm");
        form.reset();
    });

    $('#btnSubmit').on('click', function () {
        event.preventDefault();
        if (hasAnythingChanged()) {
            alert('Submitting at least one changed value!');
            // Do your submit action here
        } else {
            alert('Please change at least one value.')
            return false;
        }
    });
});

演示：http://jsfiddle.net/BenjaminRay/jLvh98br/

Javascript检查表单当前数据是否等于其原始数据

1 个答案: