在做项目时遇到了一个关于遍历的问题,

前提是:在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 在遍历时只会显示最后一个遍历到的结果的更多相关文章

  1. [转]WordPress“添加媒体”文件时只显示上传到当前文章的附件图片

    使用WordPress的朋友应该都清楚,特别是喜欢图文并茂的网站,肯定离不开的就是WordPress文章编辑页面的“添加媒体”按钮,每次点击就能弹出一个插入多媒体的界面,然后页面默认就会列举加载所有最 ...

  2. HTML input="file" 浏览时只显示指定文件类型 xls、xlsx、csv

    html input="file" 浏览时只显示指定文件类型 xls.xlsx.csv <input id="fileSelect" type=" ...

  3. <input type="file" />浏览时只显示指定文件类型

    <input type="file" />浏览时只显示指定文件类型 <input type="file" accept="appli ...

  4. 在子页面使用layer弹出层时只显示遮罩层,不显示弹出框问题

    最近子页面使用layer弹出层时只显示遮罩层,不显示弹出框,这个问题搞了很久,最后才发现,在子页面上使用弹出框时,如果只使用layer.alert()或者layer.open()时,会默认在当前页面弹 ...

  5. js-页面需展示大量图片时,采用lyz.delayLoading.min.js,图片在屏幕时加载显示

    本文本内容拷贝至:https://blog.csdn.net/xuanwuziyou/article/details/48199123 当一个网页中有大量图片时,浏览器会逐个去下载这些图片,等全部下载 ...

  6. css控制打印时只显示指定区域

      CreateTime--2017年9月26日08:16:04 Author:Marydon css控制打印时只显示指定区域 思路: 1.使用打印命令@media print: 2.控制执行打印命令 ...

  7. Matlab7.1——启动时只显示Logo

    1. 现象 Matlab7.1在启动时只显示Matlab的Logo: 2. 解决方法 听我的吧,这个是官方办法,我也亲自试过了1结束matlab进程:2在C:\user\APPDATA\Roaming ...

  8. jquery ajax请求方式与提示用户正在处理请稍等,等待数据返回时loading的显示

    1.jquery ajax请求方式与提示用户正在处理请稍等 为了提高用户体验度,我们通常会给出 “正在处理,请稍等!”诸如此类的提示.我们可通过设置$.ajax()下的参数beforeSend()来实 ...

  9. 关于js渲染网页时爬取数据的思路和全过程(附源码)

    于js渲染网页时爬取数据的思路 首先可以先去用requests库访问url来测试一下能不能拿到数据,如果能拿到那么就是一个普通的网页,如果出现403类的错误代码可以在requests.get()方法里 ...

随机推荐

  1. SpringMVC原理及非注解配置详解

    1. Spring介绍 Spring MVC是Spring提供的一个强大而灵活的web框架.借助于注解,Spring MVC提供了几乎是POJO的开发模式,使得控制器的开发和测试更加简单. 这些控制器 ...

  2. Serv-u Mysql数据库用户

    Serv-u 关联Mysql数据库用户需要用到ODBC数据源,windows不自带支持MySQL.所以要网上下载自己安装 官网下载地址:http://dev.mysql.com/downloads/c ...

  3. Mysql的JDBC

    Java程序可以通过JDBC链接数据库,通过JDBC可以方便的访问数据库,不必为特定的数据库编写专门的程序. 需要先配置mysql-connector-java-5.0.8-bin.jar 使用JDB ...

  4. 小白读iOS冗余资源扫描脚本

    随着公司项目的不断功能迭代,项目的体积越来越大,各种瘦身策略迫在眉睫.由于平时使用Linux高级命令和 shell脚本的机会不多,之前学的知识一下子想起来很难.所有趁着这次看脚本,重新温习一下. 本文 ...

  5. ajax访问controller,无法通过return $this->goHome()跳转

    第一次在yii2中使用ajax来请求controller,做的是第三方登录,facebook和google登录. 登录成功应该跳转到首页,想当然的以为用return $this->goHome( ...

  6. hadoop入门,跑出第一个WordCount

    1.环境准备 下载:http://mirror.bit.edu.cn/apache/hadoop/common/hadoop-2.7.2/hadoop-2.7.2.tar.gz 解压:解压后,修改et ...

  7. 强连通分量tarjan缩点——POJ2186 Popular Cows

    这里的Tarjan是基于DFS,用于求有向图的强联通分量. 运用了一个点dfn时间戳和low的关系巧妙地判断出一个强联通分量,从而实现一次DFS即可求出所有的强联通分量. §有向图中, u可达v不一定 ...

  8. codeforces 475D. CGCDSSQ

    D. CGCDSSQ time limit per test 2 seconds memory limit per test 256 megabytes Given a sequence of int ...

  9. 常用颜色RGB、灰度值

    128/0/0       深红         255/0/0       红           255/0/255     粉红        255/153/204 玫瑰红       153 ...

  10. sqlite 的基本使用3

    AND 运算符和OR运算符 这两个运算符一般被称为连接运算符,用来缩小sqlite所选的数据 AND 运算符是当所有的条件都为真时,表达式才为真 sqlite and name = "bb& ...