jquery中 toggleClass方法的一种用法

<html>
<head>
<script src="js/jquery.js" type="text/javascript"></script>  
</head>
<body>
<style>
.list_1{color:red}
.list_2{color:green}
.list_3{color:blue}
.list_4{color:#}
</style>
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>

<button class="b1">方式一提交</button>
<button class="b2">方式二提交</button>

<script>
$(document).ready(function () {
    $(".b1").click(function () {
        $('ul li').toggleClass(function () {
             return 'list_' + $(this).index();
        });
    });
    
    $(".b2").click(function () {
        $('ul li').toggleClass(function (index) {
            return 'list_' + index;
        });
    });
})
</script> 
<body>
</html>

两种方式效果一致。

$(selector).toggleClass(function(index,class),switch)  其中index可选,接受选择器的位置。

jquery index()  方法返回指定元素相对于其他指定元素的 index 位置。

更多相关文章
  • jquery手册描述: data 发送到服务器的数据.将自动转换为请求字符串格式.GET 请求中将附加在 URL 后.查看 processData 选项说明以禁止此自动转换.必须为 Key/Value 格式.如果为数组,jQuery 将自动为不同值对应同一个名称.如 {foo:["bar1 ...
  • 本文实例讲述了jQuery中index()方法用法.分享给大家供大家参考.具体分析如下: 此方法可以搜索匹配元素,并返回元素的索引值.索引值是从0开始的. 语法结构一: 当此方法没有参数的时候,返回值是指定元素在其同辈元素集合中的索引位置. 代码代码如下: $(selector).index()  
  • 参考原文:深度理解Jquery 中 offset() 方法
  • 第一个Ajax例子 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </ ...
  • 本文是对Jquery中$.get(),$.post(),$.ajax(),$.getJSON()的用进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所幫助     详细解读Jquery各Ajax函数:$.get(),$.post(),$.ajax(),$.getJSON() 一,$.ge ...
  • 解析JQuery中css()方法,獲取元素CSS值之getComputedStyle方法(轉載,寫的很好)
    一.碎碎念~前言 我们都用过jQuery的CSS()方法,其底层运作就应用了getComputedStyle以及getPropertyValue方法. 对于那些只想混口饭吃的人来讲,晓得CSS()如何使用就足够了.对于希望在JS道路上越走越远的来人说,简单了解一些JS库底层实现对自己的学习很有幫助.
  • 这是工作遇到scrollTop() 方法.为了强化自己,把它记录在博客园当中. 下面就开始scrollTop 用法讲解: scrollTop() 定义和用法 scrollTop() 方法设置或返回被选元素的[垂直滚动条位置]. Note: 当滚动条位置位于最顶部时,位置是0:当用于返回位置时:   
  • 最近项目中,需要在一个bpl中调用另一个bpl中的单元的方法, 方法如下:   在被调用的单元中定义: procedure Inner_Ex(VoucherType: TVoucherType); exports Inner_Ex;   实现: procedure Inner_Ex(VoucherT ...
一周排行
  • 这一章咱们来讲讲Exchange中对邮件的QOS设置,这些设置平常也许大多数场景中不会涉及到,因为需要大批量发送邮件的场景里都会用到邮件中间件(发送大量宣传邮件或者报表).但是一旦让咱们碰上了,咱们也得知道从哪下手去
  • 


    		    我的技術我做主Office 365_郵件遷移系列之_直接轉換遷移(CEM)
    今天给大家带来的是Office 365 邮件迁移 相信大家都听说过Office 365吧, ...
  • 函数函数对象函数字面量调用参数返回异常给类型增加方法递归作用域闭包回调模块级联套用记忆   函数 1 函数对象  在JS中函数就是对象.对象是“名/值”对的集合并拥有一个连接到原型对象的隐藏连接.对象字面量产生的对象
  • 终于有时间了,打算在这个周末认认真真的研究虚幻引擎网络架构,同时我在Safaribooksonline上面发现了一本能让我的生活变得轻松的书Multiplayer Game Programming by Rough
  • 


    		    Windows server 2003 WINS 全攻略
    NetBios名称概述 网络中的一台计算机可以使用NETBIOS和DNS两种命名方式为其命
  • using UnityEngine; using System.Collections; public class joint { public Vector3 org; public Vector3 end; }
  •     CCLabelTTF* label1 = CCLabelTTF::labelWithString("1掼蛋as", "AppleGothic", 15);     la ...
  • The Pilots Brothers refrigerator(dfs)
    The Pilots Brothers' refrigerator Time Limit:
  • 關于taglib的uri域
    如果tld文件中有uri,那么你可以直接使用该tld文件中写的uri,就不用在web.xm
  • 在上一篇中详细介绍了jQuery中ajax局部方法$.load()的使用.下面来介绍两个全局方法$.get(),$.post()的使用. 1.这两个全局方法其实和上一篇中的$.load()方法使用是差不多的.只是多了 ...