jquery中$each()

$.each():可用于遍历任何的集合(无论是数组或对象)

$(selector).each():专用于jquery对象的遍历,

如果是数组,回调函数每次传入数组的索引和对应的值(值亦可以通过this 关键字获取,但javascript总会包装this 值作为一个对象—尽管是一个字符串或是一个数字),方法会返回被遍历对象的第一参数.

each的几种常用的用法

一维数组:var arr1 = [ "aaa", "bbb", "ccc" ];

$.each(arr1, function(i,val){ alert(i); alert(val);
});
alert(i)将输出0,1,2
alert(val)将输出aaa,bbb,ccc

②一维数组:var arr2 = [['a', 'aa', 'aaa'], ['b', 'bb', 'bbb'], ['c', 'cc', 'ccc']]

$.each(arr2, function(i, item){ alert(i); alert(item); 
});
//arr2为一个二维数组,item相当于取这二维数组中的每一个数组。
//item[0]相对于取每一个一维数组里的第一个值 
alert(i)将输出为0,1,2,因为这二维数组含有3个数组元素
alert(item)将输出为 ['a', 'aa', 'aaa'],['b', 'bb', 'bbb'],['c', 'cc', 'ccc']
$.each(arr, function(i, item){ $.each(item,function(j,val){alert(j);alert(val);}); 
});
alert(j)将输出为0,1,2,0,1,2,0,1,2
//将会输出每个数组的每个值
alert(val)将输出为a,aa,aaa,b,bb,bbb,c,cc,ccc

实例:动态生成树

后台返回的是一个二维数组

<div class="wrapper wrapper-content animated fadeInRight"><div class="row"><div class="col-lg-12"><div class="ibox float-e-margins"><div class="ibox-content"><ul class="nav" id="menus"></ul><span id="liMsg"></span></div></div></div></div>
</div>
<script type="text/javascript">$(document).ready(function () {jQuery.ajax({type:'POST',url: '/ZAdmin/MenuHandler.ashx',data: {action:'rootMenu'},dataType:'json',success: function (data) {if (data.Status == 200) {var htmlLi = "";$.each(data.Data, function (i, item) {htmlLi +='<li>';$.each(item, function (j, val) {if (j == 'menu_name') {htmlLi+='<a>' + val + '</a>';}});htmlLi+='</li>';$('#menus').html(htmlLi);});} else {$('#liMsg').text('异常');}},error: function (errorThrown) {jQuery('#liMessage').val('网络通讯异常');return false;}})});
</script>

这块遇到一个问题,由于我是动态拼数据,当我用append()时,不能追加到临时变量上,试了很多方法,转成jquery对象也不行

后来只能把动态生成的数据写在临时变量中然后用html()往里插入

 

转载于:https://www.cnblogs.com/cuijl/p/6669081.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/284037.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【QGIS入门实战精品教程】7.2:QGIS点状数据符号化设置案例教程

点状符号化的类型有:单一符号、分类、渐进、基于规则、点的位移、点聚类、热图。 相关阅读: 【QGIS入门实战精品教程】7.1:QGIS面状数据符号化设置案例教程 文章目录 一、单一符号二、分类三、渐进四、基于规则五、点的位移六、点聚类七、热图一、单一符号 跟面状符号一样,…

SpringCloud与Dubbo的比较

Dubbo 一、dubbo简介 Dubbo是阿里巴巴公司开源的一个高性能优秀的服务框架&#xff0c;使得应用可通过高性能的RPC实现服务的输出和输入功能&#xff0c;可以和Spring框架无缝集成。 Dubbo是一款高性能、轻量级的开源Java RPC框架&#xff0c;它提供了三大核心能力&#xff…

VR 技术加上 8K 画质! 2016 年里约奥运会亮点十足

据报道&#xff0c;2016 年里约奥运会将运用到 VR 技术。 最近&#xff0c;奥林匹克广播服务公司&#xff08;OBS&#xff09;表示出对虚拟现实技术的兴趣&#xff0c;其实用虚拟现实技术报道赛事已经不是什么新鲜的事了&#xff0c;之前 NBA 就这样做过&#xff0c;但是将奥运…

POJ 1986 Distance Queries(LCA)

【题目链接】 http://poj.org/problem?id1986 【题目大意】 给出一棵树&#xff0c;问任意两点间距离。 【题解】 u,v之间距离为dis[u]dis[v]-2*dis[LCA(u,v)] 【代码】 #include <cstdio> #include <algorithm> #include <cstring> using namespace std; c…

WPF 实现柱形统计图

WPF 实现柱形统计图WPF 实现柱形统计图作者&#xff1a;WPFDevelopersOrg原文链接&#xff1a; https://github.com/WPFDevelopersOrg/WPFDevelopers框架使用大于等于.NET40&#xff1b;Visual Studio 2022;项目使用 MIT 开源许可协议&#xff1b;避免画线发虚DrawingContext…

Win11卸载WSL,卸载Windows子系统

虽然 Linux 发行版可以通过 Microsoft Store 安装&#xff0c;但不能通过 Microsoft Store 卸载。 可以通过下列命令卸载。 1、查看当前环境安装的wsl wsl --list2、注销&#xff08;卸载&#xff09;当前安装的Linux的Windows子系统 wsl --unregister Ubuntu3、卸载成功&#…

100亿人口会挨饿吗?人工智能迎击全球粮食问题

给作物看病的AI、走路“长眼”的拖拉机、上帝视角的卫星数据分析——未来吃饭就靠它们了。 图片来源&#xff1a;Blue River Technology 人类又面临了一项危机——随着人口不断膨胀&#xff0c;到2050年人类总人口也许要达到100亿&#xff0c;然而&#xff0c;地球却没有等比例…

Python学习总结15:时间模块datetime time calendar (二)

二 、datetime模块 1. datetime中常量 1&#xff09;datetime.MINYEAR&#xff0c;表示datetime所能表示的最小年份&#xff0c;MINYEAR 1。 2&#xff09;datetime.MAXYEAR&#xff0c;表示datetime所能表示的最大年份&#xff0c;MAXYEAR 9999。 2. datetime中的常见类 da…

switch注意事项

Day03_SHJavaTraining_4-5-2017 switch注意事项&#xff1a;①switch语句接受的数据类型  switch语句中的表达式的数据类型,是有要求的    JDK1.0 - 1.4 数据类型接受 byte short int char    JDK1.5 数据类型接受 byte short int char enum(枚举)  …

WSL1 和 WSL2对比

从 WSL1 更新到 WSL2的主要原因包括&#xff1a; 提高文件系统性能&#xff0c;支持完全的系统调用兼容性。 WSL 2 使用最新、最强大的虚拟化技术在轻量级实用工具虚拟机 (VM) 中运行 Linux 内核。 但是&#xff0c;WSL 2 不是传统的 VM 体验。 ​ 本指南将比较 WSL 1 和 WSL …

SkiaSharp 之 WPF 自绘 粒子花园(案例版)

此案例包含了简单的碰撞检测&#xff0c;圆形碰撞检测方法&#xff0c;也可以说是五环弹球的升级版&#xff0c;具体可以根据例子参考。粒子花园这名字是案例的名字&#xff0c;效果更加具有科技感&#xff0c;很是不错&#xff0c;搞搞做成背景特效也是不错的选择。Wpf 和 Ski…

xshell连接ubuntu

1.更新资料列表 sudo apt-get update2.安装openssh-server sudo apt-get install openssh-server3.查看ssh服务是否启动 sudo ps -e | grep ssh4.如果没有启动&#xff0c;启动ssh服务 sudo service ssh start5.查看IP地址 sudo ifconfig如果出现xshell无法输入密码的情况…

教你从零开始搭建一款前端脚手架工具

本文系原创&#xff0c;转载请附带作者信息&#xff1a;Jrain Lau项目地址&#xff1a;https://github.com/jrainlau/s...前言 在实际的开发过程中&#xff0c;从零开始建立项目的结构是一件让人头疼的事情&#xff0c;所以各种各样的脚手架工具应运而生。笔者使用较多的yoeman…

微信小程序 --- 页面跳转

第一种&#xff1a;wx.navigateTo({}); 跳转&#xff1a; 注意&#xff1a;这种跳转回触发当前页面的 onHide 方法&#xff0c;将当前页面隐藏&#xff0c;然后显示跳转页面。所以可以返回&#xff0c;返回的时候触发 onShow方法进行显示&#xff1a; &#xff08;项目的底部导…

Java基础 深拷贝浅拷贝

Java基础 深拷贝浅拷贝 非基本数据类型 需要new新空间class Student implements Cloneable{private int id;private String name;private Vector course;public Student(){try{Thread.sleep(1000);System.out.println("Student Constructor called.");}catch (Interr…

不安装运行时运行 .NET 程序

好久没写文章了&#xff0c;有些同学问我公众号是不是废了&#xff1f;其实并没有。其实想写的东西很多很多&#xff0c;主要是最近公司比较忙&#xff0c;以及一些其他个人原因没有时间来更新文章。这几天抽空写了一点点东西&#xff0c;证明公众号还活着。长久以来的认知&…

一文弄懂分布式和微服务

简单的说&#xff0c;微服务是架构设计方式&#xff0c;分布式是系统部署方式&#xff0c;两者概念不同。 微服务 简单来说微服务就是很小的服务&#xff0c;小到一个服务只对应一个单一的功能&#xff0c;只做一件事。这个服务可以单独部署运行&#xff0c;服务之间可以通过R…

常见的js算法面试题收集,es6实现

1、js 统计一个字符串出现频率最高的字母/数字 let str asdfghjklaqwertyuiopiaia; const strChar str > {let string [...str],maxValue ,obj {},max 0;string.forEach(value > {obj[value] obj[value] undefined ? 1 : obj[value] 1if (obj[value] > max)…

PHP面向对象(OOP)----分页类

PHP面向对象(OOP)----分页类 同验证码类&#xff0c;分页也是在个人博客&#xff0c;论坛等网站中不可缺少的方式&#xff0c;通过分页可以在一个界面展示固定条数的数据&#xff0c;而不至于将所有数据全部罗列到一起&#xff0c;实现分页的原理其实就是对数据库查询输出加了一…

JS 事件练习

QQ拖拽及状态栏选择 HTML 1 <!DOCTYPE html>2 <html xmlns"http://www.w3.org/1999/xhtml">3 <head>4 <title>QQ练习</title>5 <link href"css/main.css" rel"stylesheet" />6 <script src&…