编程 Javascript

jquery map方法使用示例

Posted in Javascript onApril 23, 2014

jQuery.map( array, callback(elementOfArray, indexInArray) )

Returns: Array

感觉jquery的map方法非常好用，特向大家分享下。

方法作用：将数组或单个对象，替换为新的内容。
应用实例：获取一组checkbox的值，以英文逗号分隔，进行拼接。

<html> 
<head> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.1.min.js"></script> 
<script> 
$(function(){ 
$("input").click(function(){ 
var str = $(":checked").map(function(){ 
return this.value; 
}).get().join(",") 
$("span").html(str); 
}) 
}) 
</script> 
</head> 
<body> 
<input type="checkbox" value="a"/>a 
<input type="checkbox" value="b"/>b 
<input type="checkbox" value="c"/>c 
<br/> 
结果展示：<span/> 
</body> 
</html>

对于CSDN的代码编辑，实在不敢恭维，我在jsFiddle创建了上述例子，附链接：http://jsfiddle.net/dV8eh/。

jquery map方法使用示例

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

将HTMLCollection/NodeList/伪数组转换成数组的实现方法

Jun 20 Javascript

jQuery判断元素是否存在的可靠方法

May 06 Javascript

探析浏览器执行JavaScript脚本加载与代码执行顺序

Jan 12 Javascript

JS for循环中i++ 和 ++i的区别介绍

Jul 20 Javascript

JavaScript中清空数组的三种方式

Mar 22 Javascript

JavaScript队列的应用实例详解【经典数据结构】

Apr 12 Javascript

vue全局组件与局部组件使用方法详解

Mar 29 Javascript

小程序显示弹窗时禁止下层的内容滚动实现方法

Mar 20 Javascript

基于node简单实现RSA加解密的方法步骤

Mar 21 Javascript

浅谈Vue页面级缓存解决方案feb-alive(上)

Apr 14 Javascript

Vue页面跳转传递参数及接收方式

Sep 09 Javascript

JavaScript实现队列结构过程

Dec 06 Javascript

js通过更改按钮的显示样式实现按钮的滑动效果

Apr 23 #Javascript

js Dialog 去掉右上角的X关闭功能

Apr 23 #Javascript

Jquery实现Div上下移动示例

Apr 23 #Javascript

JQuery为页面Dom元素绑定事件及解除绑定方法

Apr 23 #Javascript

JQuery下拉框应用示例介绍

Apr 23 #Javascript

JQuery对表格进行操作的常用技巧总结

Apr 23 #Javascript

IE6已终止操作问题的2种情况及解决

Apr 23 #Javascript