Question

我需要你的帮助。

什么是最好的＆amp;大多数表单字段有效地检测文本框中的更改？

对任何文本框进行更改后，应启用“保存更改”按钮。

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<table>
    <tr>
        <td><input type="text" id="txt1" value="text1"></td>
        <td><input type="text" id="txt2" value="text2"></td>
        <td><input type="text" id="txt3" value="text3"></td>
    </tr>
    <tr>
        <td><input type="text" id="txt4" value="text4"></td>
        <td><input type="text" id="txt5" value="text5"></td>
        <td><input type="text" id="txt6" value="text6"></td>
    </tr>
    <tr>
        <td><input type="text" id="txt7" value="text7"></td>
        <td><input type="text" id="txt8" value="text8"></td>
        <td><input type="text" id="txt9" value="text9"></td>
    </tr>
</table>
<input type="button" value="save changes" disabled>

</body>

</html>

Answer 1

纯JS方法：

var textboxes = document.querySelectorAll("table tr td input");

for (var i = 0; i < textboxes.length; i++) {
    textboxes[i].onkeyup = function() {
        document.getElementById("save").disabled = false;
    }
}

document.getElementById("save").onclick = function() {
    //do stuff, and disabled
    this.disabled = true;
}

Answer 2

也许这个，在jQuery框架中：

$("input[type=text]").change(function() {
    $("input[type=button]").removeAttr("disabled");
});

如何检测文本框的更改并启用保存更改按钮

2 个答案: