此选择器主要是对所选择的表单元素进行过滤：
| 选择器 | 描述 | 返回 |
| enabled | 选择所有的可用的元素 | 集合元素 |
| disabled | 选择所有的不可用的元素 | 集合元素 |
| checked | 选择所有被选中的元素（单选框，复选框） | 集合元素 |
| selected | 选择所有被选中选项元素（下拉列表） | 集合元素 |
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
$(function(){
$("#btn1").click(function(){
//使所有的可用的单行文本框的 value 值变为 尚硅谷
alert($(":text:enabled").val());
$(":text:enabled").val("西游记");
});
$("#btn2").click(function(){
$(":text:disabled").val("www.xiyouji.com");
});
$("#btn3").click(function(){
var num =
$(":checkbox[name='newsletter']:checked").length;
alert(num);
}); $("#btn5").click(function(){
//实际被选择的不是 select, 而是 select 的 option 子节点
//所以要加一个 空格.
//var len = $("select :selected").length
//alert(len); //因为 $("select :selected") 选择的是一个数组
//当该数组中有多个元素时, 通过 .val() 方法就只能获取第一个被选择的值了.
//alert($("select :selected").val()); //jQuery 对象遍历的方式使 each, 在 each 内部的 this 是正在
//得到的 DOM 对象, 而不是一个 jQuery 对象
$("select :selected").each(function(){
alert(this.value);
});
}); $("#btn4").click(function(){
$(":checkbox[name='newsletter']:checked").each(function(){
alert(this.value);
});
});
})
</script> </head>
<body>
<h3>表单对象属性过滤选择器</h3>
<button id="btn1">对表单内 可用input 赋值操作.</button>
<button id="btn2">对表单内 不可用input 赋值操作.</button><br /><br />
<button id="btn3">获取多选框选中的个数.</button>
<button id="btn4">获取多选框选中的内容.</button><br /><br />
<button id="btn5">获取下拉框选中的内容.</button><br /><br /> <form id="form1" action="#">
可用元素: <input name="add" value="可用文本框1"/><br>
不可用元素: <input name="email" disabled="true" value="不可用文本框"/><br>
可用元素: <input name="che" value="可用文本框2"/><br>
不可用元素: <input name="name" disabled="true" value="不可用文本框"/><br>
<br> 多选框: <br>
<input type="checkbox" name="newsletter" checked="checked" value="test1" />test1
<input type="checkbox" name="newsletter" value="test2" />test2
<input type="checkbox" name="newsletter" value="test3" />test3
<input type="checkbox" name="newsletter" checked="checked" value="test4" />test4
<input type="checkbox" name="newsletter" value="test5" />test5 <br><br>
下拉列表1: <br>
<select name="test" multiple="multiple" style="height: 100px">
<option>孙悟空</option>
<option selected="selected">唐僧</option>
<option>猪八戒</option>
<option selected="selected">沙和尚</option>
<option>林冲</option>
<option>武松</option>
</select> <br><br>
下拉列表2: <br>
<select name="test2">
<option>刘德华</option>
<option>释小龙</option>
<option selected="selected">成龙</option>
</select> <textarea rows="" cols=""></textarea>
</form>
</body>
</html>
表单选择器：
JQuery表单元素过滤选择器的更多相关文章
-
jQuery选择器(表单元素过滤选择器)第八节
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
-
Jquery | 基础 | jQuery表单对象属性过滤选择器
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>使用jQuery表单对象属性 ...
-
jQuery表单对象属性过滤选择器
jQuery表单对象属性过滤选择器 <div id="p1" attr="p1"> <input type="text" ...
-
jQuery 表单元素取值与赋值方法总结
一.普通文本框的赋值与取值 1.1.1赋值 <h2>jQuery 表单元素取值与赋值方法总结</h2> <input type="text" clas ...
-
jQuery 表单域选中选择器
复选框.单选按钮.下拉列表 /***********************************************/ <script type="text/javascrip ...
-
jquery 表单元素选择器
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content ...
-
jquery表单内容过滤
效果: 输入筛选字段后显示效果: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http ...
-
jQuery表单元素非空验证
<script type="text/javascript"> $(function(){ /************* ...
-
Jquery | 基础 | 使用 jQuery 表单过滤选择器
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
-
mysql5.7.13-windows 免安装版配置简介
1.下载mysql5.7.13-windows版本 (1)mysql5.7.13-win64版本百度云下载链接分享地址:链接:http://pan.baidu.com/s/1slMl4Ah 密码:w6 ...
-
asp.net使用控件datagrid实现表头单元格合并
合并的要点: 1.datagid的单元格合并原理是table中tr,td的布局实现; 2.合并的时机实在其datagridcreate事件中实现; 3.认识一个对象TableCellCollectio ...
-
响应式图片srcset学习
响应式图片srcset全新释义sizes属性w描述符 先转再看
-
解决secureCRT数据库里没有找到防火墙 &#39;无&#39;问题
中文版的secureCRT由于汉化的问题(把null翻译成无了),导致每次打开都会有个防火墙的错误提示:数据库里没有找到防火墙 '无' 此会话将尝试不通过防火墙进行连接.出现这个错误的原因是在secu ...
-
ShortcutMapper – 热门应用程序的可视化快捷键
ShortcutMapper 是一个流行应用程序的键盘快捷键映射.该应用程序使用 Ajax 调用来加载键盘和应用程序数据.首先,试图找到一个在线资源,其中列出了每个平台的所有应用程序快捷方式.然后你可 ...
-
用K2 smartforms开发一个应用程序究竟比ASP.NET快多少？
这次试验的起因是一场内部辩论. “用K2 smartforms开发一个应用程序究竟比ASP.NET快多少?” 我们推测是快4倍. 但是经过测试发现,我们推测错了. 本文记录了试验的规划.过程以及令人惊 ...
-
nginx笔记---http配置
1.三个逻辑区段 http:该区段嵌入配置文件的根部,在这个区段中允许定义指令和嵌入http相关模块.他包含了一个或多个server区段,他也能够使全局配置生效. server:这个区段建立了一个站点 ...
-
bzoj3767 A+B Problem加强版
Description Input 输入A,B Output 输出A+B. Sample Input 1 1 Sample Output 2 HINT 对于100%的数据,保证 |A| , | ...
-
利用WebClient上传参数及文件流到远程ashx服务
原文 利用WebClient上传参数及文件流到远程ashx服务 1 思路: WebClient.UploadFile()方法可以上传文件:UploadData()方法可以上传数据参数:如何合二为一既上 ...
-
Tab选项卡的原生写法
关键点:建立点击事件和显示事件的连接,即点li 1让对应的div1出来,很容易想到遍历.索引 ;;} ul,li{list-style: none;} .tab{background: rgba(2, ...