js 在遍历时只会显示最后一个遍历到的结果
在做项目时遇到了一个关于遍历的问题,
前提是:在ul中有n个li每个li从后台获取的数据中有一个sign的字段,当sign等于0时(li未被点击过)li会显示一个红点,当sign不等于0时(li已被点击)红点会消失,开始时的代码是这样的
for(var i=0;i<data.length;i++){
if(data[i].sign==0){
$api.addCls($api.dom('#mark_red'), 'mark_red');
}else{
$api.removeCls($api.dom('#mark_red'), 'mark_red');
}
}
这段代码看似没错,运行后发现只会显示最后一个的结果,最后一个li的sign=0,显示,不等于零消失,并没有达到自己想要的效果
这是因为循环时并没有保存之前的sign的值,到结束最后一个值会覆盖之前的值,所以只会有最后一个的效果,
解决方法:
首先我先把data里的sign值放入了一个空数组data_read,
var data_read=[];
for(var i=0;i<data.length;i++){
read=data[i].read;
data_read.push(read);
}
之后遍历
$("#ul_read li").each(function(){
index=$(this).index();
if(data_read[index]==0){
$(this).find('.mark').css('display','block');
}else{
$(this).find('.mark').css('display','none');
}
})
这样就完美解决了上面的问题,当然肯定还有其他更简便的方法,欢迎批评指正
js 在遍历时只会显示最后一个遍历到的结果的更多相关文章
- [转]WordPress“添加媒体”文件时只显示上传到当前文章的附件图片
使用WordPress的朋友应该都清楚,特别是喜欢图文并茂的网站,肯定离不开的就是WordPress文章编辑页面的“添加媒体”按钮,每次点击就能弹出一个插入多媒体的界面,然后页面默认就会列举加载所有最 ...
- HTML input="file" 浏览时只显示指定文件类型 xls、xlsx、csv
html input="file" 浏览时只显示指定文件类型 xls.xlsx.csv <input id="fileSelect" type=" ...
- <input type="file" />浏览时只显示指定文件类型
<input type="file" />浏览时只显示指定文件类型 <input type="file" accept="appli ...
- 在子页面使用layer弹出层时只显示遮罩层,不显示弹出框问题
最近子页面使用layer弹出层时只显示遮罩层,不显示弹出框,这个问题搞了很久,最后才发现,在子页面上使用弹出框时,如果只使用layer.alert()或者layer.open()时,会默认在当前页面弹 ...
- js-页面需展示大量图片时,采用lyz.delayLoading.min.js,图片在屏幕时加载显示
本文本内容拷贝至:https://blog.csdn.net/xuanwuziyou/article/details/48199123 当一个网页中有大量图片时,浏览器会逐个去下载这些图片,等全部下载 ...
- css控制打印时只显示指定区域
CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域 思路: 1.使用打印命令@media print: 2.控制执行打印命令 ...
- Matlab7.1——启动时只显示Logo
1. 现象 Matlab7.1在启动时只显示Matlab的Logo: 2. 解决方法 听我的吧,这个是官方办法,我也亲自试过了1结束matlab进程:2在C:\user\APPDATA\Roaming ...
- jquery ajax请求方式与提示用户正在处理请稍等,等待数据返回时loading的显示
1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...
- 关于js渲染网页时爬取数据的思路和全过程(附源码)
于js渲染网页时爬取数据的思路 首先可以先去用requests库访问url来测试一下能不能拿到数据,如果能拿到那么就是一个普通的网页,如果出现403类的错误代码可以在requests.get()方法里 ...
随机推荐
- HDU 6047 Maximum Sequence(线段树)
题目网址:http://acm.hdu.edu.cn/showproblem.php?pid=6047 题目: Maximum Sequence Time Limit: 4000/2000 MS (J ...
- ORA-12516: TNS: 监听程序找不到符合协议堆栈要求的可用处理程”的异常
简单说明:我们开发时多人开发,会频繁访问服务器数据库,结果当连接数大的时候,就会报ora-12516的错误,ORA-12516: TNS: 监听程序找不到符合协议堆栈要求的可用处理程"的异常 ...
- PHP面向对象中 static:: 与 self:: parent:: $this-> 的区别
很多好几年工作经验的PHP工程师,对PHP面向对象中 static:: .self::.parent::.$this-> 的定义和使用都不清晰,特做详细梳理: static:: 可以访问全局作 ...
- [技术] OIer的STL入门教程
注: 本文主要摘取STL在OI中的常用技巧应用, 所以可能会重点说明容器部分和算法部分, 且不会讨论所有支持的函数/操作并主要讨论 C++11 前支持的特性. 如果需要详细完整的介绍请自行查阅标准文档 ...
- 表达式求值(二叉树方法/C++语言描述)(三)
二叉树方法求值对运算数处理的方法与栈方法求值不太相同,除了将字符串中的运算数转换为浮点类型外,还需要生成新的节点: void Calculator::dealWithNumber(char *& ...
- html、js、django处理日期问题
在html中使用日期控件,利用ngmodel将输入的值传到js里: <input type="date" ng-model="timeOps.test.a_time ...
- pip&easy_install使用
pip install ... easy_install ... ******************************************************************* ...
- 每日Linux命令(1)-date
显示日期指令:date 1.如果想知道Linux系统的时间,那么可以在shell终端直接输入date命令,时间就会反白显示在终端. ysxy@ubuntu:~$ date Tue Aug :: CST ...
- [ZYNQ-7]PS处理PL外部中断的简单实例的剖析 (参考米联miz702n)
Zynq的ARM通过GIC中断控制器来接收核仲裁所有的中断.由于中断向量表只有4Bytes大小,仅仅正好存放一条跳转语句,因此当产生一个外部中断时,中断处理的大致过程:PC内容保存到LR_IRQ用于中 ...
- Linux - 简明Shell编程08 - 函数(Function)
脚本地址 https://github.com/anliven/L-Shell/tree/master/Shell-Basics 示例脚本及注释 #!/bin/bash function Check( ...