jQuery点击改变class并toggle及toggleClass()方法定义用法
更新时间：2015年12月11日 09:07:46 作者：cag2050
这篇文章主要介绍了jQuery点击改变class并toggle及toggleClass()方法定义用法的相关资料,需要的朋友可以参考下
我滴古老风格，废话不多说，贴代码了。
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery-1.11.1.min.js"></script>
<style>
.bg1 {
background-image:url(images/21.jpg);
background-repeat:no-repeat;
color:#0CF;
}
.bg2 {
background-image:url(images/22.jpg);
background-repeat:no-repeat;
color:#F00;
}
</style>
<script type="text/javascript">
//参数para1：希望隐藏元素的id值
function toggle1(para1){
if ($("#p2").attr("class")=="bg1")
{
$("#p2").attr("class","bg2");
}
else
{
$("#p2").attr("class","bg1");
}
$("#"+para1).toggle();
}
</script>
</head>
<body>
<p id="p1">此处将显示或隐藏</p>
<p id="p2" class="bg1" onClick="toggle1('p1')" style="height:31px">点击此处显示或隐藏上面部分并更换自己的样式(包括背景图、字体等）</p>
</body>
</html>
jQuery toggleClass() 方法
实例
对添加和移除所有 <p> 元素的 "main" 类进行切换：
$("button").click(function(){
$("p").toggleClass("main");
});
定义和用法
toggleClass() 方法对添加和移除被选元素的一个或多个类进行切换。
该方法检查每个元素中指定的类。如果不存在则添加类，如果已设置则删除之。这就是所谓的切换效果。
然而，通过使用 "switch" 参数，您能够规定只删除或只添加类。
语法
$(selector).toggleClass(classname,function(index,currentclass),switch)
相关文章
jquery为我们提供了操作数组和对象的工具函数，方便和简化了我们对它们的操作。今天我们就进入jQuery的工具函数的复习。2015-06-06
这篇文章主要介绍了jquery实现简单的轮换出现效果,涉及jquery针对图片样式切换效果的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-07-07
jquery 实现的改变颜色与背景的代码 change(fontsize,background)补充2
change事件会在元素失去焦点的时候触发，也会当其值在获得焦点后改变时触发。2010-05-05
jQuery获取文本节点之 text()/val()/html() 方法区别
在jquery中val,text,html都能取到值,或加一个参数来赋值,那么它们有些什么区别?2011-03-03
这篇文章主要介绍了jQuery中animate动画第二次点击事件没反应的解决方法，非常的实用，有需要的小伙伴可以参考下2015-05-05
这篇文章主要介绍了json格式的javascript对象用法,结合实例形式总结分析了javascript针对json格式数据操作的常见技巧,需要的朋友可以参考下2016-07-07
这篇文章主要为大家详细介绍了jquery背景跟随鼠标滑动导航，特别美观，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2015-11-11
基于jquery完美拖拽，可返回拖动轨迹 用JQ实现，话不多说，直接上码2012-03-03
jquery中cookie用法实例详解(获取,存储,删除等)
这篇文章主要介绍了jquery中cookie用法,结合实例详细分析了jQuery操作cookie的获取,存储,删除等操作,并附带了Jquery操作Cookie记录用户查询过信息实现方法,需要的朋友可以参考下2016-01-01
jQuery animate和CSS3相结合实现缓动追逐效果附源码下载
这篇文章主要介绍了jQuery animate和CSS3相结合实现缓动追逐效果的相关资料,需要的朋友可以参考下2016-04-04
最新评论