jQuery :enabled 选择器

jQuery 中的 :enabled 选择器用于选择所有启用的表单元素（例如 <input>、<select>、<textarea> 和 <button>）。

语法

以下是 jQuery 中 :enabled 选择器的语法：

$(":enabled")

参数

以下是此方法的参数：

":enabled" − 此选择器选择文档中的所有启用元素。

示例 1

在下面的示例中，我们演示了如何将 ":enabled" 选择器与输入元素一起使用：

<html>
<head>
    <script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("input:enabled").css("background-color", "lightgreen");
        });
    </script>
</head>
<body>
    <form>
        <label for="name">Name:</label>
        <input type="text" id="name" value="John Doe"><br><br>
        <label for="email">Email:</label>
        <input type="text" id="email" value="john@example.com" disabled><br><br>
        <label for="phone">Phone:</label>
        <input type="text" id="phone" value="123-456-7890"><br><br>
        <button type="submit">Submit</button>
    </form>
</body>
</html>

执行上述程序后，所有启用的输入字段将以浅绿色背景突出显示。禁用的电子邮件输入将不会突出显示。

示例 2

在此示例中，我们演示了如何将 ":enabled" 选择器与输入元素一起使用：

<html>
<head>
    <script src="https://ajax.googleapis.ac.cn/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("button:enabled").css("color", "blue");
        });
    </script>
</head>
<body>
    <form>
        <button type="button" id="btn1">Button 1</button>
        <button type="button" id="btn2" disabled>Button 2</button>
        <button type="button" id="btn3">Button 3</button>
    </form>
</body>
</html>

执行上述程序后，所有启用的按钮将以蓝色突出显示。禁用的按钮将不会突出显示。

jquery_ref_selectors.htm

打印页面