当有人写关键字时启用HTML搜索按钮


HTML Search Button Enable When Someone Write A Keyword

如何使搜索按钮仅在用户在搜索字段中输入文本时才启用?当搜索字段为空时,应禁用该按钮,否则应启用该按钮。这是我的代码:

<form action="search.php" method="get">
    <input type="text" name="search" placeholder="Search Here" size="100px" />
    <input type="submit" value="search" />
</form>

您需要使用<script>标记:

<form action="search.php" method="get">
    <input id="textField" type="text" name="search" placeholder="Search Here" size="100px" />
    <input id="submitButton" type="submit" value="search" disabled="disabled" />
</form>
<script>
    var submitButton = document.getElementById("submitButton");
    var textField = document.getElementById("textField");
    textField.onkeyup = function(){
        if (textField.value == "") {
            submitButton.disabled = true;
        } else {
            submitButton.disabled = false;
        }
    }
</script>

此脚本监视文本字段的更改,检查它是否为空,并禁用按钮。

使用jQuery可以更优雅地完成这项工作。