Question

使用下面显示的代码，我想在用户点击按钮时禁用文本输入。

当我点击我的按钮时，文本输入仅在它再次启用之前禁用一秒钟。

我想知道为什么会这样。

<html>

<head>
    <script src='http://code.jquery.com/jquery-2.1.1.min.js'></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $('#enable').click(function() {
                $('#textBox').removeAttr("disabled")
            });
            $('#disable').click(function() {
                $('#textBox').attr("disabled", "disabled");
            });
        });
    </script>
</head>

<body>
    <form>
        <input type="text" id="textBox" />
        <button id="enable">Enable</button>
        <button id="disable">Disable</button>
    </form>
</body>

</html>

Answer 1

表单内的按钮会提交表单，重新加载页面，因为它的默认类型为submit。

您必须更改类型

<input type="button" id="enable" value="Enable">

或阻止默认

$('#enable').click(function (e) {
    e.preventDefault();
    $('#textBox').prop("disabled", false);
});
$('#disable').click(function (e) {
    e.preventDefault();
    $('#textBox').prop("disabled", true);
});

使用prop()表示已停用的属性。

禁用文本输入，单击按钮

1 个答案: