今天做项目时,要求完成功能评价的分类,即好评,差评,中评。遇到一个问题,如何在选定一个评论类型时,该div颜色改变,其他评论类型的div颜色不变。

在使用$(this).attr()时,表示当前元素的某一属性,而要获取其他元素的属性
使用siblings方法。
$(this).siblings().attr()
<div class='evaluate-nav clearfix' id="evaluate">
<div class='e-nav-item f-l on' id="allEvaluate">
<span>全部评价</span>
<span id="ae"></span>
</div>
<div class='e-nav-item f-l' id="goodEvaluate">
<span>好评</span>
<span id="ge"></span>
</div>
<div class='e-nav-item f-l' id="midEvaluate">
<span>中评</span>
<span id="me"></span>
</div>
<div class='e-nav-item f-l' id="badEvaluate">
<span>差评</span>
<span id="be"></span>
</div>
</div>
$("#evaluate").on('click','div',function(e){
e.preventDefault();
var idA = $(this).attr('id');
var scoreType = 0;
if (idA == "allEvaluate") {
scoreType = null;
$(this).attr('class','e-nav-item f-l on');
$(this).siblings().attr('class','e-nav-item f-l');
} else if (idA == "midEvaluate") {
scoreType = 1;
$(this).attr('class','e-nav-item f-l on');
$(this).siblings().attr('class','e-nav-item f-l');
} else if (idA == "badEvaluate") {
scoreType = 2;
$(this).attr('class','e-nav-item f-l on');
$(this).siblings().attr('class','e-nav-item f-l');
} else if (idA == "goodEvaluate") {
$(this).attr('class','e-nav-item f-l on');
$(this).siblings().attr('class','e-nav-item f-l');
}
$.fd.ajax({
url : 'api/scores',
type: 'get',
async: true,
data : {start:0,length:10,condition:{productId:id,scoreType:scoreType}},
success: function(d) {
//清空数据
$(".evaluate-list").empty();
//显示数据
$(".evaluate-list").getEvaluate({
maxNum:5
},d.data.data);
$("#checkEvaluate").modal("show");
}
});
})

使用jquery实现获取除this(当前选定)以外的元素的更多相关文章

  1. jquery如何获取第一个或最后一个子元素

      jquery如何获取第一个或最后一个子元素? 通过children方法,children("input:first-child") $(this).children(" ...

  2. jquery 如何获取有多个class名的元素

      1.情景展示 如何使用jquery获取带有多个class样式的元素? 2.解决方案 $("p.opinion.mb15.gray2e.max2line.mr20:contains('大摩 ...

  3. js jquery获取当前元素的兄弟级 上一个 下一个元素 jquery如何获取第一个或最后一个子元素

    var chils= s.childNodes;  //得到s的全部子节点 var par=s.parentNode;   //得到s的父节点 var ns=s.nextSbiling;   //获得 ...

  4. jquery如何获取第一个或最后一个子元素?

    通过children方法,children("input:first-child") 1 2 $(this).children("input:first-child&qu ...

  5. JavaScript(19)jQuery HTML 获取和设置内容和属性

    jQuery HTML jQuery 拥有可操作 HTML 元素和属性的强慷慨法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力.jQuery 提供一系列与 D ...

  6. jQuery常用方法一览及JQuery选择器获取表格中按钮所在行的其他列值

    Attribute: $(”p”).addClass(css中定义的样式类型); 给某个元素添加样式$(”img”).attr({src:”test.jpg”,alt:”test Image”}); ...

  7. js和jquery如何获取图片真实的宽度和高度

    按照插入的图片的尺寸来判断图片是横图还是竖图.然后判断过后给予不同的展示方式,下面为大家介绍下js和jquery如何获取图片真实的宽度和高度   1.什么时候需要获取图片真实的宽度和高度 在做pc网页 ...

  8. Js获取下拉框选定项的值和文本

    Js获取下拉框的值和文本网上提供了2种方法:但有些人很不负责任,他们根本没考虑到浏览器之间的差异导致的错误,导致很多新手琢磨了半天找不出错误! 下面我总结下Firefox和IE下获取下拉框选定项的值和 ...

  9. 如何解决谷歌浏览器下jquery无法获取图片的尺寸

    代码如下: $(document).ready(function(){ var img_h=$img.height(); var img_w=$img.width(); }) 以上代码在IE和火狐中没 ...

随机推荐

  1. PAT甲级——1098 Insertion or Heap Sort (插入排序、堆排序)

    本文同步发布在CSDN:https://blog.csdn.net/weixin_44385565/article/details/90941941 1098 Insertion or Heap So ...

  2. Jmeter report优化

    优化大致过程 生成并的报告模板: <?xml version="1.0" encoding="UTF-8"?> <xsl:stylesheet ...

  3. 牛客练习赛43D(贪心)

    有生之年我居然也能不看题解做出来题QAQ-- 发现c.d是0.1序列而不是随机数列说明有蹊跷,于是发现负数直接配0,正数配1即可.不知道哪个最小,那就全求一下吧--我的做法的坑点是数正好为1时不可以选 ...

  4. linux高级编程基础系列:线程间通信

    linux高级编程基础系列:线程间通信 转载:原文地址http://blog.163.com/jimking_2010/blog/static/1716015352013102510748824/ 线 ...

  5. Storm概念学习系列之storm的设计思想

    不多说,直接上干货! storm的设计思想 在 Storm 中也有对流(Stream)的抽象,流是一个不间断的.无界的连续 Tuple(Storm在建模事件流时,把流中的事件抽象为 Tuple 即元组 ...

  6. 【Java密码学】XML签名

    http://www.oracle.com/technetwork/articles/javase/dig-signature-api-140772.html XML签名的结构和类型 基本上XML签名 ...

  7. java打印堆栈信息

    StackTraceElement[] stackElements = new Throwable().getStackTrace(); if(stackElements != null){ for( ...

  8. ios MBProgressHUD 使用,及二次封装

    MBProgressHUD是一个显示HUD窗口的第三方类库,用于在执行一些后台任务时,在程序中显示一个表示进度的loading视图和两个可选的文本提示的HUD窗口.MBProgressHUD 二次封装 ...

  9. vue-pos : 子组件与子组件通讯

    子组件与子组件通讯: 例子子组件1 要与子组件2 通讯 步骤1 : 在父组件新建一个 vue 对象 : const eventHub = new Vue() 步骤2 : 子组件1 发起事件 :this ...

  10. 在浏览器地址栏按回车、F5、ctrl+F5刷新页面的区别

    url地址栏里敲击enter:这样的刷新,大家可以在firebug里看一下,只有少数的请求会发送出去,而且几乎没有图片的请求,这是因为请求时会先检查本地是不是缓存了请求的图片,如果有缓存而且没有过期( ...