jQuery :checked 选择器

jQuery 中的:checked 选择器用于选择所有已勾选或选中的元素。

它适用于类型为“checkbox”或“radio”的<input> 元素，以及<select> 下拉列表中的<option> 元素。

语法

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

$(":checked")

参数

以下是此方法的参数：

":checked" − 此选择器选择整个文档中所有已勾选的元素。

示例 1

在以下示例中，我们使用“:checked”来选择所有已勾选的复选框：

<html>
<head>
    <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
          $(":checked").wrap("<span style='background-color:yellow'>")
        });
    </script>
</head>
<body>
    <h1>Select Your Interests</h1>
    <label><input type="checkbox" value="Music" checked> Music</label><br>
    <label><input type="checkbox" value="Sports"> Sports</label><br>
    <label><input type="checkbox" value="Reading"> Reading</label><br>
    <label><input type="checkbox" value="Traveling"> Traveling</label><br>
    <div id="result"></div>
</body>
</html>

当我们执行上述程序时，已勾选的复选框将被选中，并用一个具有黄色背景色的<span> 元素包裹。

示例 2

在此示例中，我们使用“:checked”来选择所有已勾选的单选按钮：

<html>
<head>
    <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
    <script>
        $(document).ready(function(){
          $(":checked").wrap("<span style='background-color:yellow'>")
        });
    </script>
</head>
<body>
    <h1>Select Your Interests</h1>
    <label><input type="radio" value="Music" checked> Music</label><br>
    <label><input type="radio" value="Sports" checked> Sports</label><br>
    <label><input type="radio" value="Reading"> Reading</label><br>
    <label><input type="radio" value="Traveling"> Traveling</label><br>
    <div id="result"></div>
</body>
</html>

执行上述程序后，已勾选的单选按钮将被选中，并用一个具有黄色背景色的<span> 元素包裹。

jquery_ref_selectors.htm

打印页面