今天整理了一下jquery遍历的两个用法,分享给大家。

1.$().each 主要用来遍历DOM元素,获取DOM的值或样式等。

2.$.each() 主要用来遍历后台ajax返回的json数组,循环将数组的值赋予DOM元素等。

$().each。上代码:

<button id="get_category">获取单选框分类名称</button>
<tbody>
<tr>
<td><input type="checkbox" name="ckb" value="分类一"></td>
<td>分类一</td>
<tr>
<tr>
<td><input type="checkbox" name="ckb" value="分类二"></td>
<td>分类二</td>
<tr>
</tbody>

JS代码:

$("#get_category").on('click',function(){
var checkids = [];
$("input[name='ckb']:checked").each(function(i){
checkids[i] = $(this).val();
});
alert(checkids);
});

点击按钮,你就会发现被选中行的分类名称就可以alert出来。

$.each() 上代码:

$.get("{:U('Record/Index')}",{info:info},function(data){
$.each(data, function(i, item){
alert(item.name+item.tel)
});
});

该段JS代码,第一行为发送ajax请求,info为发送数据,这些都不需要理解,只需要清楚data为ajax返回值,假设返回的data数组有"name"和"tel"两个键值,那么通过$.each()就可以将data中的所有数组元素alert出来。其中i为循环值,循环一次自动加1,item为数组中的元素。当然,i和item没有固定的写法,你也可以写成 function(a, ele)等任何形式。

jquery还有很多内置好的遍历方法,parent()、children()、find()、siblings()等,很常用,用法也很简单,都可以在下面的菜鸟教程链接查到,这里就不一一介绍了。

https://www.runoob.com/jquery/jquery-ref-traversing.html

如遇到难题欢迎联系wx:offer555沟通解决。

感兴趣的朋友欢迎扫码关注我的公众号,里面有很多笔者的原创技术文章,希望对大家有所帮助:)

jquery遍历获取带checkbox表格的选中值以及遍历json数组的更多相关文章

  1. jquery获取复选框(checkbox)的选中值(一组和单个)

    使用jquery获取一组或者单个checkbox的选中状态的值.下面通过一个示例进行说明,假设现有一页面有一组checkbox的name的值为id,那么获取这组name=id的checkbox的值的方 ...

  2. Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关

    常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐 ...

  3. js获取table checkbox选中行的值.mdjs获取table checkbox选中行的

    <!DOCTYPE html> <html> <head> <script src="https://cdn.staticfile.org/jque ...

  4. jQuery实现获取选中复选框的值

    <!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>Jq ...

  5. JQuery实现获取多个input输入框的值,并存放在一个数组中

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. jquery获取radio选中值及遍历

    使用jquery获取radio的值,最重要的是掌握jquery选择器的使用,在一个表单中我们通常是要获取被选中的那个radio项的值,所以要加checked来筛选,比如有以下的一些radio项:1.& ...

  7. js获取checkbox中所有选中值及input后面所跟的文本

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  8. JQuery设置获取下拉菜单选项的值 多实例

    分享下JQuery如何设置获取下拉菜单某个选项的值,多种方法,值得收藏. JQuery获取和设置Select选项 获取Select :获取select 选中的 text :$(“#ddlRegType ...

  9. JQuery 同时获取多个标签的指定内容并储存为数组

    在网页开发中经常会碰到获取同种类型的 标签 的值得问题,比如下面的两种情况. 当需要批量获取同种标签的指定值时,新人就会碰上一点小麻烦. 比如 id=problem1的demo var list1=$ ...

随机推荐

  1. PHP: thinkPHP踩坑记录(实现API接口以及处理莫名其妙的500问题)

    因为各种原因开始学习PHP,并且要在两周内能够对PHP项目进行二次开发,还好PHP够简单,至少入门很简单,很快就接触thinkPHP框架. 在了解了路由匹配视图的规则之后,开始着手尝试编写API接口, ...

  2. 手工实现hashset

    package cn.study.lu.four; import java.util.*; /** * 手工实现hashmap,加深理解底层原理 * @author Administrator * * ...

  3. Django的使用一

    Django是一个由Python写成的Web应用框架,是 Python 社区的两大最受欢迎的 Web 框架之一(另一个是 Flask). Django的主要目的是简便.快速的开发数据库驱动的网站. 1 ...

  4. DGA域名检测

    一.DGA域名原理 僵尸网络(Botnet):互联网上在蠕虫.木马.后门工具等,传统恶意代码形态的基础上发展.融合而产生的一种新型攻击方法. DNS(Domain Name System) :基于 U ...

  5. XCODE真机调试No Devices Registered

    百思不得期解,摸索发现是由于没有选择真机设备的原因, 在Xcode左上角选择真机设备即可.

  6. netty模型简介

    Netty工作原理图 netty抽象出了两组线程池,BossGroup专门负责客户端 的连接,WorkerGroup专门负责网络读写. BossGroup和WorkerGroup 类型都是NioEve ...

  7. Selenium-Switch与SelectApi介绍

    Switch 我们在UI自动化测试时,总会出现新建一个tab页面,弹出一个浏览器级别的弹框或者是出现一个iframe标签,这时我们用WebDriver提供的Api接口就无法处理这些情况了.需要用到Se ...

  8. VSCode必备插件

    通用组件 1.汉化插件 https://marketplace.visualstudio.com/items?itemName=MS-CEINTL.vscode-language-pack-zh-ha ...

  9. POJ 2253 Frogger ( 最短路变形 || 最小生成树 )

    题意 : 给出二维平面上 N 个点,前两个点为起点和终点,问你从起点到终点的所有路径中拥有最短两点间距是多少. 分析 : ① 考虑最小生成树中 Kruskal 算法,在建树的过程中贪心的从最小的边一个 ...

  10. DELPHI 把数据库中的数据转换成XML格式

    function ReplaceString(AString: string): string; begin Result := StringReplace(AString, '&', '&a ...