因为这是做一个层弹出 不能用页面刷新吧建议你把这些样式写在一个cs文件里面，然后不要用cs选择器，直接用jQuery对他们的样式进行添加
代码像你这样写也可以，但保证你的逻辑是清晰的！我也是菜鸟，感觉一步一步来好些！$(this).find('a').find('i').addClass('m_i').parent().parent().siblings().find('a').find('i').removeClass('m_i');
这么长的赋值确实看的蛮蛋疼的。。
因为这是做一个层弹出 不能用页面刷新吧建议你把这些样式写在一个cs文件里面，然后不要用cs选择器，直接用jQuery对他们的样式进行添加
代码像你这样写也可以，但保证你的逻辑是清晰的！我也是菜鸟，感觉一步一步来好些！$(this).find('a').find('i').addClass('m_i').parent().parent().siblings().find('a').find('i').removeClass('m_i');
这么长的赋值确实看的蛮蛋疼的。。
temp=$(".div").eq(0).html()
点下重置，再填回去就行了
$(".div").eq(0).html(temp)
因为这是做一个层弹出 不能用页面刷新吧你这些样式的添加和去除 是在一个弹出的层里面的哈？恩 是的最外层的div 就一个弹出层 其他的效果都是在这个弹出层里实现的
我试过这种方法 可是 填回去的内容的 其他的效果都不能实现了
想重置成什么样的，就在什么时候保存html
我试过这种方法 可是 填回去的内容的 其他的效果都不能实现了
想重置成什么样的，就在什么时候保存html我就是保存最开始的html 填回去的内容 其他的效果都不能实现了 你试试就知道了
我为了兼容各版本库，一直没用过on，都是用$(document).bind()的
坐等解释
('div.div_head ul:eq(0) li:eq(0)').trigger("click");
试用了下.bind() 填回去的内容 其他的效果还是不能实现了
记得要这样绑: $(document.body).on('click','.div_head li',function(){<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<style>
*{
margin: 0;
padding: 0;
}
li{
list-style: none;
}
.div{
width: 300px;
margin:0 auto;
border:1px solid #066;
}
.div_head{
width:300px;
height:35px;
border-bottom:1px solid #066;
}
.div_head li{
width: 95px;
height: 35px;
display:inline-block;
border-right:1px solid #066;
line-height: 35px;
text-align: center;
}
.div_head li.active{
background:#00BCF3;
color:#FFF;
}
.div_head li:last-child{
border-right:0;
}
.div_menu{
width:300px;
border-top:0;
}
.div_xia{
width:300px;
border-top:1px solid #066;
text-align:center;
padding:10px 0;
}
.div_xia a{
width:100px;
height:30px;
display:block;
text-align:center;
line-height:30px;
background:#3CC;
color:#FFF;
cursor:pointer;
}
.div_menu .div_menu_item{
width:300px;
height:100px;
text-align:center;
display:none;
}
.div_menu_item li{
width:300px;
height:30px;
line-height:30px;
display:inline-block;
position:relative;
border:1px solid #999;
}
.div_menu_item li.on{
background:#9C6;
}
.div_menu_item .m_i{
width:10px;
height:10px;
position:absolute;
right:10px;
top:10px;
background:#00BCF3;
}
</style>
<script>
$(function(){
var _html=$(".div").html() $(document.body).on('click','.div_head li',function(){
$(this).addClass('active').siblings().removeClass('active'); var index=$('.div_head li').index(this);
$('.div_menu > div').eq(index).show().siblings().hide();
});
$(document.body).on('click','.div_menu_item li',function(){
$(this).addClass('on').siblings().removeClass('on');
$(this).find('a').find('i').addClass('m_i').parent().parent().siblings().find('a').find('i').removeClass('m_i');
});
$(document.body).on("click",'.div_xia a',function(){
$(".div").html(_html)
})
})
</script>
</head>
<body>
<div class="div">
<div class="div_head">
<ul>
<li class="active">点击1</li>
<li>点击2</li>
<li>点击3</li>
</ul>
</div>
<div class="div_menu">
<div class="div_menu_item" style="display:block;">
<ul>
<li class="on">
<a>111111111<i class="m_i"></i>
</a>
</li>
<li>
<a>222222222<i></i>
</a>
</li>
</ul>
</div>
<div class="div_menu_item">
<ul>
<li class="on">
<a>3333333333<i class="m_i"></i>
</a>
</li>
<li>
<a>4444444444<i></i>
</a>
</li>
</ul>
</div>
<div class="div_menu_item">
<ul>
<li class="on">
<a>555555555555<i class="m_i"></i>
</a>
</li>
<li>
<a>66666666<i></i>
</a>
</li>
</ul>
</div>
</div>
<div class="div_xia">
<a href="javascript:;">重置效果</a>
</div>
</div>
</body></html>
$('#reset').click(function(){
$('.div_head li').eq(0).trigger('click');
});
还原的话 直接就删掉原来的 把 备份的 append进去