[ jquery 方法 toggleClass(class|fn[,sw]) ] 此方法如果存在（不存在）就删除（添加）一个类

用来返回在匹配的元素集合中的每个元素上用来切换的样式类名的一个函数:

如果第二个参数是callback,那么需要返回的是类名,函数传参解释如下:

　　1:接收元素的索引位置和元素旧的样式类作为参数

　　2: 一个用来判断样式类添加还是移除的 boolean 值

　　3.用于决定元素是否包含class的布尔值(sw[switch])

实例:

<!DOCTYPE html>
<html lang='zh-cn'>
<head>
<title>Insert you title</title>
<meta http-equiv='description' content='this is my page'>
<meta http-equiv='keywords' content='keyword1,keyword2,keyword3'>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<!-- <script type='text/javascript' src='./js/jquery-3.0.0.js'></script> -->
<script type='text/javascript' src='./js/jquery-1.12.1.min.js'></script>
<style type='text/css'>
   input{font:400 13px/20px 'Courier New';color:#000;}
   .addOne{padding:0 8px;}
   .addTwo{color:#999;}
   button[type='button']{font:400 13px/1.2em 'Courier New';padding:3px;}
</style>
<script type='text/javascript'>
    $(function(){
        $('button').click(function(){
           $('#user').toggleClass(function(index,oldClass){
               return 'addTwo';
            });
        });
    });
</script>
</head>
<body>
   <input type='text' id='user' required="required" value='user' class='addOne addTwo'/>
   <button type='button'>toggleClass</button>
</body>
</html>

 

posted @ 2016-06-22 01:03  窗棂  Views(842)  Comments(0)  Edit  收藏  举报