您的位置:首页 > Web前端 > JQuery

jquery简单的点击切换效果

2016-06-30 00:59 429 查看
标记法:

利用flag标记的方法控制切换的状态:

html:

<a href="#">更多</a>

jquery:
$(function(){
var flag=true;
$("a").click(function(){
if(flag){
$(this).html("简化");
flag=false;
}else{
$(this).html("更多");
flag=true;
}
})
})


html:

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul>
<a href="#">更多</a>


jquery:

$(function(){
var flag=true;
$("li").eq(4).nextAll().hide()
$("a").click(function(){
if(flag){
$(this).html("简化");
$("li").eq(4).nextAll().show();
flag=false;
}else{
$(this).html("更多");
$("li").eq(4).nextAll().hide();
flag=true;
}
})
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: