jQuery学习10---属性过滤选择器，表单选择器，遍历复选框

最新推荐文章于 2024-04-05 12:11:45 发布
最新推荐文章于 2024-04-05 12:11:45 发布
阅读量3k 收藏 2
点赞数
分类专栏： jQuery 文章标签： 属性过滤选择器 表单选择器 遍历复选框
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zheng0518/article/details/9165533
版权


一、属性过滤选择器
$("div[id]")选取有id属性的<div>
$("div[title=test]")选取title属性为test的<div>,jQuery中没有对getElementByName()进行封装
比如选取所有的文本框，就是$("input[type=text]")
$("div[title!=test]")选取title属性不为test的<div>
$("div[id*=test]")选取id属性中包含test的<div>给定属性是以包含某些值的元素
$("div[id^=test]")选取id属性中以test开头的<div>
$("div[id$=test]")选取id属性中以test结尾的<div>
复合属性选择器就是几个中括号连起来
$("div[id^=test][id$=a]")选取id属性以test开头，以a结尾的<div>

二、表单对象选择器(过滤器)
$("#form1:enabled")选取id为form1的表单内所有启用的元素
$("#form1:disabled")选取id为form1的表单内所有禁用的元素
$("input:checked")选取所有选中的元素(Radio,CheckBox)
$("select option:selected")选取所有选中的选项元素(下拉列表)

三、表单选择器
$(":input")选取所有的<input>,<textarea>,<select>,<button>元素，和$("input")不一样，$("input")只获得<input>
$(":text")选取所有的单行文本框，等价于$("input[type=text]")
$(":password")选取所有的密码框。同理还有:radio,:checkbox,:submit,:image,:reset,:button,:file,:hidden. 


<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html;charset=GBK">
		<link rel="stylesheet" type="text/css" href="table.css">
		<title></title>
		<script src="../jquery-1.8.2.js" type="text/javascript"></script>
		<style type="text/css">
		</style>
		<script type="text/javascript">
			$(function(){
				$("#selectHobby").click(function()
				{
					$("input[type=checkbox]:checked").each(function()
					{
						alert($(this).val());
					});
				});
			});
		</script>
	</head>
	<body>
		<input type="checkbox" value="cf" />吃饭
		<input type="checkbox" value="sj" />睡觉
		<input type="checkbox" value="ddd" />打豆豆
		<input id="selectHobby" type="button" value="选择爱好">
	</body>
</html>


onyas
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
jquery表单对象属性过滤选择器实例分析
10-24
在本例中，我们关注的是jQuery中的表单对象属性过滤选择器，这些选择器专门用于筛选表单元素，如输入(input)、复选框(checkbox)、单选按钮(radio)以及下拉列表(select)的选项(option)。以下是对这些选择器的详细说明...
jQuery前端开发学习指南(14)——jQuery表单对象属性过滤选择器
谷哥的小弟
03-30 671
表单对象属性过滤选择器用于依据表单中元素的属性筛选元素。
前端简明教程系列：第二节 表格、表单元素、CSS选择器与常用属性
weixin_45204777的博客
05-05 477
本套教程使用的配套视频教程是b站up主晓舟报告的从零开始学前端系列课程的第一套-网页重构：视频链接接下来我们介绍一下表格元素，html中的表格元素用标签表示，完整的包含标题（标签）、表头（标签）、表体（标签）和脚注（标签），但不一定每一个表单都要具备这完整的四部分，可以根据实际情况进行选择和使用，以达到最佳的可读性和可访问性。示例代码如下， 其中，表头、表体和脚注中又有其他的子元素及属性，下面依次介绍下。接下来我们说表单
jQuery对象、基本选择器、表单属性过滤器和实现Ajax请求简介
最新发布
Reggie97的博客
04-05 768
本文详细介绍了jQuery的含义，并介绍饿了DOM对象和jQuery对象的相互转化，并介绍了基本选择器和表单属性过滤器等内容，也介绍了如何操作jQuery数组，包括怎么jquery怎么使用Ajax发起请求。
jQuery过滤选择器——表单对象属性过滤选择器
C.
11-13 2976
表单对象属性过滤选择器此选择器主要对所选择的表单元素进行过滤 1、:enabled 用法: $(”input:enabled”) 返回值 :集合元素 说明: 匹配所有可用元素.意思是查找所有input中不带有disabled=”disabled”的input.不为disabled,当然就为enabled啦. 2、:disabled 用法: $(”input:disabl
详解强大的jQuery选择器之过滤选择器、表单选择器
weixin_34318272的博客
02-07 111
前言 　　上一篇文章(详解强大的jQuery选择器之基本选择器、层次选择器)介绍了jQuery四类选择器中的基本选择器、层次选择器，本文将介绍剩下的两种选择器：过滤选择器、表单选择器。 　　本文仍使用上一篇文章中的示例页面。 一、过滤选择器 　　过滤选择器主要是通过特定的过滤规则来筛选出所需要的DOM元素，过滤规则与CSS中的伪类选择器语法相同。 　　按照不同的过滤规则，过滤选择器可以分...
jQuery表单元素过滤选择器用法实例分析
10-17
`:checked` 选择器用于选取已被选中的表单元素，通常用于复选框（`checkbox`）和单选按钮（`radio`）。它不会匹配到 `select` 元素中的 `option`。以下两种写法是等价的： ```javascript // 写法1 var ...
jQuery获取复选框被选中数量及判断选择值的方法详解
10-22
首先，获取复选框被选中数量可以通过使用jQuery的属性选择器和内置属性进行。如示例代码中使用了`$("input[name='test']:checked").length`来统计名称为`test`的复选框中被选中的数量。这是一个非常高效的方法，其中...
jQuery表单选择器用法详解
12-01
- `jQuery(":checked")` 选取所有被选中的复选框（`<input type="checkbox">`）和单选按钮（`<input type="radio">`）。 4. **`:disabled`** 选择器： - `jQuery(":disabled")` 选取所有被禁用的表单元素，无论...
jQuery表单域选择器用法分析
12-08
5. **`:checkbox`选择器**：此选择器选取所有类型为`checkbox`的input元素，即复选框。`$(":checkbox")`将选取所有复选框。 6. **`:file`选择器**：这个选择器选取所有类型为`file`的input元素，用于文件上传。如`$...
表单对象属性过滤选择器.html
05-17
表单对象属性过滤选择器
jQuery操作复选框checkbox方法
qq_26993175的博客
02-23 1079
jQuery赋值checked的几种写法： 所有的jQuery版本都可以这样赋值，不建议用attr()；出处：https://www.cnblogs.com/gzb1/p/16289116.html。获取单个checkbox选中项的值(三种写法)jQuery操作复选框checkbox方法。设置第一个checkbox 为选中值。设置最后一个checkbox为选中值。获取多个checkbox选中项。
jQuery基础——使用选择器—3属性选择器与表单选择器
weixin_57575133的博客
11-04 1141
属性选择器主要根据元素的属性及其属性值作为条件值作为过滤的条件，来匹配对应的DOM元素。表单是页面中使用频率较高的元素之一，为了方便用户灵活操作表单，jQuery专门定义了表单选择器，使用表单选择器可以方便地获取表单中某类表单域对象。
表单属性和表单元素
m0_61282942的博客
08-02 291
min、max、step属性 最小值、最大值、合法的数字间隔 用于包含数字的input类型，规定数值范围，如:input的number类型等 <input type="number" step="2" min="4" max="10"> placeholder属性 设置文本域的提示信息，当用户开始输入内容，提示信息会消失 autocomplete属性 设置表单是否启用自动完成功能，可以加在form标签、input标签中 在input标签中name属性...
jQuery 遍历
Wzc0720的博客
09-19 1186
jQuery 遍历
表单对象属性过滤选择器 2020-09-28
qq_43956225的博客
09-28 709
表单对象的属性过滤器通过表单元素的状态属性（例如选中、不可用等状态）匹配元素，包括 :checked 过滤器、 :disabled 过滤器、 :enabled 过滤器和 :selected 过滤器 4 种。 过滤器 说明 示例 :checked 匹配所有选中的被选中元素 $(“input:checked”) //匹配checked属性为checked的input元素 – – – :disabled 匹配所有不可用元素 $(“input:disabled”) //匹配disa
jQuery(二)——jQuery选择器之表单对象过滤选择器
HangHug_L的博客
01-30 895
4. 表单对象过滤选择器 在开始之前，先介绍两个属性disabled属性和multiple属性，它们和checked属性、selected属性一样： checked=“checked” 表示多选框或单选框中的被初始时选中，不写就不选中。 selected=“selected” 表示下拉列表中的option项是否被选中 disabled=“disabled” 表示input输入框是否可用，默认可用，为enabled，disabled时不可用 multiple=“multiple” 表示下拉列表是否允许多
表单对象属性过滤选择器
wujunlei1595848的博客
06-21 642
选择器 描述 返回 示例 :enabled 选取所有可用的元素 集合元素 $('#form1:enabled');选取id为"form1"的表单内的所有可用元素 :disabled 选取所有不可用的元素 集合元素 $("#form2:disabled")选取id为"form2"的表单内的所有不可用的元素 :checked 选取...
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值