jquery的each方法

来源：互联网发布：java后台接收json 编辑：程序博客网时间：2024/05/21 08:42

each函数根据参数的类型实现的效果不完全一致：

1、遍历对象(有附加参数)

$.each(Object, function(p1, p2) {

this; //这里的this指向每次遍历中Object的当前属性值

p1; p2; //访问附加参数

}, ['参数1', '参数2']);

2、遍历数组(有附件参数)

$.each(Array, function(p1, p2){

this; //这里的this指向每次遍历中Array的当前元素

p1; p2; //访问附加参数

}, ['参数1', '参数2']);

3、遍历对象(没有附加参数)

$.each(Object, function(name, value) {

this; //this指向当前属性的值

name; //name表示Object当前属性的名称

value; //value表示Object当前属性的值

});

4、遍历数组(没有附加参数)

$.each(Array, function(i, value) {

this; //this指向当前元素

i; //i表示Array当前下标

value; //value表示Array当前元素

});

案例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>属性选择器学习</title>

//使用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>

<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>

<option>java开发工程师</option>

<option>系统分析师</option>

</select>

</select>

</form>

</div>

</body>

</html>

案例二

0 0