jQuery表单选择器（附有代码以及运行截图）

最新推荐文章于 2022-01-25 07:00:00 发布

原创最新推荐文章于 2022-01-25 07:00:00 发布 · 420 阅读

0 ·

CC 4.0 BY-SA版权

html复习专栏收录该内容

23 篇文章

订阅专栏

本文介绍了jQuery提供的表单选择器，包括enabled、disabled、checked和selected等，通过示例展示了如何使用这些选择器来定位HTML表单中的元素。

表单作为HTML中常见的元素，操作方法较为多样性和特殊性，jQuery为表单专门提供了选择器和过滤器来准确的定位表单元素。
下面举几个常见的选择器：
enabled选择所有可用元素
disabled选取所有不可用元素
checked选取所有被选中的元素
selected选取所有被选中的选项元素（下拉列表为主)
举个例子：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<form id="testForm">
    <input type="button" value="1">按钮
    <input type="submit" value="2">提交
</form>
</body>
<script type="text/javascript" src="../static/js/jquery-3.5.1.js">
</script>
<script>
    var $enableInput = $("#testForm input:enabled");
    for(var i = 0;i < $enableInput.length;i++){
        document.writeln( $enableInput.get(i).value );
    }
</script>
</html>

运行结果：
在这里插入图片描述