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的三种遍历方法的更多相关文章

  1. Java中Map的三种遍历方法

    Map的三种遍历方法: 1. 使用keySet遍历,while循环: 2. 使用entrySet遍历,while循环: 3. 使用for循环遍历.   告诉您们一个小秘密: (下↓面是测试代码,最爱看 ...

  2. jquery中each()的三种遍历用法

    1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function  ...

  3. jquery中each的3种遍历方法

    1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function  ...

  4. Jquery中each的3种遍历方式

    学习目标: 参考博文: https://blog.csdn.net/honey_th/article/details/7404273 一.Jquery中each的几种遍历方法 1. 选择器+遍历 &l ...

  5. 2017.10.25 Java List /ArrayList 三种遍历方法

    java list三种遍历方法性能比较 学习java语言list遍历的三种方法,顺便测试各种遍历方法的性能,测试方法为在ArrayList中插入记录,然后遍历ArrayList,测试代码如下: pac ...

  6. 谈谈vector容器的三种遍历方法

    说明:本文仅供学习交流.转载请标明出处.欢迎转载!          vector容器是最简单的顺序容器,其用法相似于数组.实际上vector的底层实现就是採用动态数组.在编敲代码的过程中.经常会变量 ...

  7. map的三种遍历方法！

    map的三种遍历方法!   集合的一个很重要的操作---遍历,学习了三种遍历方法,三种方法各有优缺点~~ /* * To change this template, choose Tools | Te ...

  8. javase-常用三种遍历方法

    javase-常用三种遍历方法 import java.util.ArrayList; import java.util.Iterator; import java.util.List; public ...

  9. Java List /ArrayList 三种遍历方法

    java list三种遍历方法性能比较http://www.cnblogs.com/riskyer/p/3320357.html JAVA LIST 遍历http://blog.csdn.net/lo ...

随机推荐

  1. [SharePoint 2010] Copy list item with version history and attachment

    private void MoveItem(SPListItem sourceItem, SPListItem destinationItem) { if (sourceItem == null || ...

  2. 导入csv文件到mysql

    原文 给自己做备份的,高手们请忽略. 数据太大,用数据库客户端软件直接导入非常卡,还是直接执行SQL吧. 1.指定文件路径. 2.字段之间以逗号分隔,数据行之间以\r\n分隔(我这里文件是以\n分隔的 ...

  3. sql服务器启动不了问题

    问题:the the service mysql56 failed the most recent status change request with the messagethe service  ...

  4. memcpy内存复制

    memcpy(predata,frame,1920*1080*4);

  5. js隐式转换

    JavaScript的数据类型分为六种,分别为null,undefined,boolean,string,number,object.object是引用类型,其它的五种是基本类型或者是原始类型.我们可 ...

  6. SQLServer中用先进先出思想求成本价和平均成本单价

    1.首先是创建表: create table #in ( id ,), TDate datetime not null, goodcode ) , InNum ,) null, --入库数量 Pric ...

  7. Python爬虫爬取百度贴吧的帖子

    同样是参考网上教程,编写爬取贴吧帖子的内容,同时把爬取的帖子保存到本地文档: #!/usr/bin/python#_*_coding:utf-8_*_import urllibimport urlli ...

  8. 老贼博客php教程从零学习PHP开始写作，顺祝新同事快乐！

    随笔是不是这样写的,好似是吧! 老贼博客php教程从零学习PHP开始写作,顺祝新同事快乐! 谢谢支持,点赞!

  9. 夺命雷公狗----Git---3---vi编辑器

    如果直接使用了 git commit 即进入vi编辑器,所以强烈推荐使用 git commit -m  中文注释 但是如果进入vi编辑器其实也没什么好怕的,如果动linux 的朋友应该都会使用 进入v ...

  10. [Struts2] Action Implements SessionAware

    struts2 的Action中若希望访问Session对象,可采用两种方式: 1.从ActionContext中获取: 2.实现SessionAware接口. 1.从ActionContext中获取 ...