Jquery中each的三种遍历方法
$.post("urladdr",
{
"data" : "data"
},
function(data) {
$.each(data, function(n,value) {
});
});
1、选择器+遍历
$('div').each(function (i){
i就是索引值
this 表示获取遍历每一个dom对象
});
2、选择器+遍历
$('div').each(function (index,domEle){
index就是索引值
domEle 表示获取遍历每一个dom对象
});
3、更适用的遍历方法
1）先获取某个集合对象
2）遍历集合对象的每一个元素
var d=$("div");
$.each(d,function (index,domEle){
d是要遍历的集合
index就是索引值
domEle 表示获取遍历每一个dom对
});
案例：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>属性选择器学习</title>
<script language="JavaScript" type="text/javascript" src="../include/jQuery.js"></script>
<script language="javascript" type="text/javascript">
//使用jquery加载事件
$(document).ready(function (){
//<input id="btn0" type="button" value="利用jquery对象实现 修改表单中可见的文本域的值 $('input[type=text]:enabled')" />
$("#btn0").click(function (){
//当点击按钮后，设置id=two的div的背景颜色是绿色
$("input[type=text]:enabled").each(function(index,domEle){
//domEle.value="xxxxx";
$(domEle).val("xxxxxxxx");
});
});
//<input id="btn1" type="button" value="利用jquery对象实现 修改表单中不可修改的文本域的值 $('input[type=text]:disabled')" />
$("#btn1").click(function (){
//当点击按钮后，设置id=two的div的背景颜色是绿色
$("input[type=text]:disabled").each(function(index,domEle){
//domEle.value="xxxxx";
$(domEle).val("xxxxxxxx");
});
});
//<input id="btn2" type="button" value="利用jquery对象实现 获取选中的复选框的个数 $('input[type=checkbox]:checked')" />
$("#btn2").click(function (){
//当点击按钮后，设置id=two的div的背景颜色是绿色
alert($("input[type=checkbox]:checked").length);
/*
$("input[type=checkbox]:checked").each(function(index,domEle){
//alert(domEle.value);
//alert(this.value);
//alert($(this).val());
});
*/
});
//<input id="btn3" type="button" value="利用jquery对象实现 获取选中的下拉菜单的内容 $('select option:selected')" />
$("#btn3").click(function (){
//当点击按钮后，设置id=two的div的背景颜色是绿色
$("select option:selected").each(function(index,domEle){
//domEle.value="xxxxx";
alert($(domEle).text());
});
});
});
</script>
</head>
<body>
<form method="post" action="">
<input type="text" value="可见元素1" />
<input type="text" value="不可见元素1" disabled="disabled" />
<input type="text" value="可见元素2" />
<input type="text" value="不可见元素2" disabled="disabled" /><br>
<input type="checkbox" value="美女" />美女
<input type="checkbox" value="美男" />美男
<input type="checkbox" value="大爷" />大爷
<input type="checkbox" value="大妈" />大妈
<br>
<input type="radio" value="男" />男
<input type="radio" value="女" />女
<br>
<select id="zhiwei" size="5" multiple="multiple">
<option>PHP开发工程师</option>
<option>数据库管理员</option>
<option>系统分析师</option>
<option>保安</option>
</select>
<select id="xueli">
<option>大专</option>
<option>中专</option>
<option>小学</option>
</select>
</form>
<div style="clear:both;">
<input id="btn0" type="button" value="利用jquery对象实现 修改表单中可修改的文本域的值 $('input[type=text]:enabled')" /><br>
<input id="btn1" type="button" value="利用jquery对象实现 修改表单中不可修改的文本域的值 $('input[type=text]:disabled')" /><br>
<input id="btn2" type="button" value="利用jquery对象实现 获取选中的复选框的个数 $('input[type=checkbox]:checked')" /><br>
<input id="btn3" type="button" value="利用jquery对象实现 获取选中的下拉菜单的内容 $('select option:selected')" /><br>
</div>
</body>
</html>
- 顶
- 0
- 踩
Jquery中each的三种遍历方法的更多相关文章
- Java中Map的三种遍历方法
Map的三种遍历方法: 1. 使用keySet遍历,while循环: 2. 使用entrySet遍历,while循环: 3. 使用for循环遍历. 告诉您们一个小秘密: (下↓面是测试代码,最爱看 ...
- jquery中each()的三种遍历用法
1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function ...
- jquery中each的3种遍历方法
1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function ...
- Jquery中each的3种遍历方式
学习目标: 参考博文: https://blog.csdn.net/honey_th/article/details/7404273 一.Jquery中each的几种遍历方法 1. 选择器+遍历 &l ...
- 2017.10.25 Java List /ArrayList 三种遍历方法
java list三种遍历方法性能比较 学习java语言list遍历的三种方法,顺便测试各种遍历方法的性能,测试方法为在ArrayList中插入记录,然后遍历ArrayList,测试代码如下: pac ...
- 谈谈vector容器的三种遍历方法
说明:本文仅供学习交流.转载请标明出处.欢迎转载! vector容器是最简单的顺序容器,其用法相似于数组.实际上vector的底层实现就是採用动态数组.在编敲代码的过程中.经常会变量 ...
- map的三种遍历方法！
map的三种遍历方法! 集合的一个很重要的操作---遍历,学习了三种遍历方法,三种方法各有优缺点~~ /* * To change this template, choose Tools | Te ...
- javase-常用三种遍历方法
javase-常用三种遍历方法 import java.util.ArrayList; import java.util.Iterator; import java.util.List; public ...
- Java List /ArrayList 三种遍历方法
java list三种遍历方法性能比较http://www.cnblogs.com/riskyer/p/3320357.html JAVA LIST 遍历http://blog.csdn.net/lo ...
随机推荐
- 学习笔记---C/C++语法
一.char *s char s[] 区别 char *s中的s是指针,而指针是指向一块内存区域,它指向的内存区域的大小可以随时改变,而且当指针指向常量字符串时,它的内容是不可以被修改的,否则在运行时 ...
- JMeter学习-026-JMeter 分布式（远程）参数化测试实例
以前文所述对文章详情的HTTP请求进行性能测试为例.日常实际场景中,不可能所有的人都在同时访问一篇文章,而是多人访问不同的文章,因而需要对文章编号进行参数化,以更好的模拟日常的性能测试场景.同时,因文 ...
- Sql Server中暂停命令
Sql Server中暂停几秒再执行后面的命令! -- 语法WAITFOR { DELAY 'time_to_pass' | TIME 'time_to_execute' | [ ( r ...
- VS工程添加资源文件
1. 添加资源文件: 2. 资源文件内写相应代码: <ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006 ...
- pypi上传库
把程序打包上传到PyPi版本库中 转自 1 首先必须要按照以下文件结构 ├── douban │ ├── cli.py │ ├── douban.py │ ├── douban_token ...
- linux学习第一天
linux touch 文件名mkdir -P 路径文件 cat 打开文件 vihostname 主机名ln 复制 ln -s 快捷方式cp 复制-r复制整个目录-p保持源文件属性不变-f强制复制mv ...
- css实现三角效果
demo <!DOCTYPE html> <html lang="zh"> <head> <meta charset=utf-8& ...
- 利用zlib库进行zip解压
1:到zlib官网上下载zlib,本文下载的是1.2.8的版本. 2:进行./configure,然后make. 3:进入zlib库中的contrib/minizip/路径下make,生成的miniz ...
- Unit01： JAVA开发环境
Top JAVA开发环境 1. JAVA开发环境 1.1. 认识Linux操作系统 1.1.1. Linux的由来及发展 Linux起源于1991年,1995年流行起来,大家可以看到旁边的这个人,它就 ...
- JsonUtil工具类
package comm; import java.text.SimpleDateFormat; import java.util.ArrayList; import java.util.Collec ...