jQuery表单选择器用法详解


Posted in jQuery onAugust 22, 2019

表单选择器

1. :button Selector

1. jQuery(":button")

2. 选择所有元素和类型为按钮的元素

2. :checkbox Selector

1. jQuery(":checkbox")

2. 选择所有元素和类型为复选框的元素

3. :checked Selector

1. jQuery(":checked")

2. 选择所有有勾选的元素

4. :disabled Selector

1. jQuery("disabled")

2. 选择所有被禁用的元素

5. :enabled Selector

1. jQuery(":enabled")

2. 选择所有未被禁用的元素

6. :file Selector

1. jQuery(":file")

2. 选择所有文件类型为file的元素

7. :focus Selector

1. jQuery(":focus")

2. 选择当前获取焦点的元素

8. :image Selector

1. jQuery(":image")

2. 选择所有图像类型的元素

9. input Selector

1. jQuery(":input")

2. 选择所有input,textarea,select和button元素

10. :password Selector

1. jQuery(":password")

2. 选择所有文件类型密码的元素

11. :radio Selector

1. jQuery(":radio")

2. 选择所有类型为单选框的元素

12. :submit Selector

1. jQuery(":submit")

2. 选择所有类型为提交的元素

例 :
var input = $(":button").addClass("marked")
// 选择所有为button的表单 然后添加样式marked

内容扩展:

代码实例:

<script>
$(function(){
    //利用:contains获取包含指定内容的组件,筛选文本内容中包含is单词的组件
    //$("p:contains(special)").css("border" , "1px solid red");
    //获取拥有名为input后代节点的标签
    //$("div:has(input)").css("border" , "1px solid red");
    //利用层叠选择器与has()选择器最大的不同时,层叠选择器选中的是input组件,而上面的has则选中的是拥有input组件的div组件
    //$("div input").css("border" , "1px solid red");
    //利用:parent选择器获取所有非空元素
    //$("*:parent").css("border" , "1px solid red");
    //利用:empty 来获取所有空元素
    //$("*:empty").css("border" , "1px solid red");
    //利用:input获取表单所有元素,:之前什么都不写默认就是*查询所有
    //$(":input").css("border" , "1px solid red");
    //$(":input").css("width" , "200px");
    //$("input,select,button").css("border" , "1px solid red");
    //获取所有按钮
    //$(":button , :submit , :reset").css("border" , "1px solid red");
    //利用:disabled获取不可用的表单元素
    //$(":disabled").css("border" , "1px solid red");
    //下面这句话与之等价
    //$("*[disabled='disabled']").css("border" , "1px solid red");
    //获取被选中的单选框或复选框
    //$(":checked").css("width" , "100px");
    $("*[checked='checked']").css("border" , "1px solid red");
  })
</script>

以上就是本次介绍的关于jQuery表单选择器的知识点全部内容,感谢大家的阅读和对三水点靠木的支持。

jQuery 相关文章推荐
jquery+css实现侧边导航栏效果
Jun 12 jQuery
关于jQuery.ajax()的jsonp碰上post详解
Jul 02 jQuery
jQuery EasyUI window窗口使用实例代码
Dec 25 jQuery
CSS3结合jQuery实现动画效果及回调函数的实例
Dec 27 jQuery
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
Vue引入jquery实现平滑滚动到指定位置
May 09 jQuery
基于jQuery使用Ajax动态执行模糊查询功能
Jul 05 jQuery
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
jQuery easyui datagird编辑行删除行功能的实现代码
Sep 20 jQuery
jQuery实现的点击图片居中放大缩小功能示例
Jan 16 jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 jQuery
JavaScript前端页面搜索功能案例【基于jQuery】
Jul 10 jQuery
详解webpack引用jquery(第三方模块)的三种办法
Aug 21 #jQuery
jquery树形插件zTree高级使用详解
Aug 16 #jQuery
jQuery zTree树插件的使用教程
Aug 16 #jQuery
jQuery zTree插件快速实现目录树
Aug 16 #jQuery
jQuery zTree插件使用简单教程
Aug 16 #jQuery
非常实用的jQuery代码段集锦【检测浏览器、滚动、复制、淡入淡出等】
Aug 08 #jQuery
jQuery提示框插件SweetAlert用法分析
Aug 05 #jQuery
You might like
Thinkphp将二维数组变为标签适用的一维数组方法总结
2014/10/30 PHP
php解析xml方法实例详解
2015/05/12 PHP
Laravel 关联模型-关联新增和关联更新的方法
2019/10/10 PHP
使用js获取QueryString的方法小结
2010/02/28 Javascript
JavaScript 基础篇(一)
2012/03/30 Javascript
javascript中将Object转换为String函数代码 (json str)
2012/04/29 Javascript
jQuery中on()方法用法实例
2015/01/19 Javascript
JavaScript模拟实现键盘打字效果
2015/06/29 Javascript
使用jQuery5分钟快速搞定双色表格的简单实例
2016/08/08 Javascript
JS中使用gulp实现压缩文件及浏览器热加载功能
2017/07/12 Javascript
jQuery Autocomplete简介_动力节点Java学院整理
2017/07/17 jQuery
微信小程序tabBar底部导航中文注解api详解
2017/08/16 Javascript
浅谈vue.use()方法从源码到使用
2019/05/12 Javascript
[02:55]DOTA2英雄基础教程 发条技师
2013/12/04 DOTA
Python运用于数据分析的简单教程
2015/03/27 Python
python模拟enum枚举类型的方法小结
2015/04/30 Python
介绍Python的Urllib库的一些高级用法
2015/04/30 Python
python计算牛顿迭代多项式实例分析
2015/05/07 Python
Python使用MONGODB入门实例
2015/05/11 Python
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
Python的条件表达式和lambda表达式实例
2019/01/31 Python
python射线法判断检测点是否位于区域外接矩形内
2019/06/28 Python
Django Admin中增加导出CSV功能过程解析
2019/09/04 Python
python字典排序的方法
2019/10/12 Python
Python中常见的数制转换有哪些
2020/05/27 Python
PyTorch的torch.cat用法
2020/06/28 Python
突袭HTML5之Javascript API扩展4—拖拽(Drag/Drop)概述
2013/01/31 HTML / CSS
维德科技C#面试题笔试题
2015/12/09 面试题
英语系本科生求职信范文
2013/12/18 职场文书
高中毕业自我鉴定
2013/12/19 职场文书
党员岗位承诺口号大全
2014/03/28 职场文书
宣传活动总结范文
2014/07/01 职场文书
整改落实情况汇报材料
2014/10/29 职场文书
城南旧事电影观后感
2015/06/16 职场文书
2015年科学教研组工作总结
2015/07/22 职场文书
mysql事务隔离级别详情
2021/10/24 MySQL