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()方法里 ...
随机推荐
- [C++]智能指针的实现与使用
智能指针 智能指针是当我们在使用对象时,有时会把对象的内存分配在堆上忘记释放,导致内存泄露,并且当多个指针共享同一个对象的内存时,容易出现重复释放内存,导致错误. 我们针对所需要共享的对象,手动完成一 ...
- 【无旋式treap】例题
[bzoj3223]文艺平衡树 Description 您需要写一种数据结构(可参考题目标题),来维护一个有序数列,其中需要提供以下操作:翻转一个区间,例如原有序序列是5 4 3 2 1,翻转区间是[ ...
- 全面理解SSD和NAND Flash
Flash Memory又叫做闪存,是一种非易失性存储器.非易失性是指断电之后数据不会丢失,这里就涉及到断电保护(后面详细讲解). 总体思路 1.NAND Flash的用途. 2.NAND Flash ...
- maven创建web工程Spring配置文件找不到问题解决方案
使用maven创建web工程,将Spring配置文件applicationContext.xml放在src/resource下,用eclipse编译时提示class path resource [ap ...
- 机器学习 —— 基础整理(三)生成式模型的非参数方法: Parzen窗估计、k近邻估计;k近邻分类器
本文简述了以下内容: (一)生成式模型的非参数方法 (二)Parzen窗估计 (三)k近邻估计 (四)k近邻分类器(k-nearest neighbor,kNN) (一)非参数方法(Non-param ...
- FillConsoleOutputAttribute 函数--指定区域填充控制台输出属性
FillConsoleOutputAttribute函数 来源:https://msdn.microsoft.com/en-us/library/windows/desktop/ms682663(v= ...
- 史上最易懂——ReactNative分组列表SectionList使用详情及示例详解
React Native系列 <逻辑性最强的React Native环境搭建与调试> <ReactNative开发工具有这一篇足矣> <解决React Native un ...
- 【Mysql】Mysql关键字
ADD ALL ALTER ANALYZE AND AS ASC ASENSITIVE BEFORE BETWEEN BIGINT BINARY BLOB BOTH BY CALL CASCADE C ...
- python有三种导入模块的方法(转)
原文:http://www.cnblogs.com/allenblogs/archive/2011/11/15/2055149.html python有三种导入模块的方法 其一, import mod ...
- 移动端 transitionEnd函数用来检测过渡是否完成
注意的几点:兼容 'webkitTransitionEnd' 解绑 renmove tab_wrap.addEventListener('transitionEnd',transitionEnd); ...