分享好友 教程首页 教程搜索 频道列表

jQuery点击展开显示文字内容代码

2018-11-27 13:125120
+关注29
核心提示:简单实用的jQuery点击展开显示文字内容代码,默认情况下只显示标题,点击展开按钮...

简单实用的jQuery点击展开显示文字内容代码,默认情况下只显示标题,点击展开按钮时,所有内容全显示,展开按钮变为收起按钮,点击收起按钮即收起展开的文字内容。

效果图

js代码

<script>
$(function(){
	$(".biji-content").hide();
	//按钮点击事件
	$("button").click(function(){
		var txts = $(this).parents("li");
		if ($(this).text() == "展开"){
			$(this).text("收起");
			txts.find(".biji-tit").hide();
			txts.find(".biji-content").show();
		}else{
			$(this).text("展开");
			txts.find(".biji-tit").show();
			txts.find(".biji-content").hide();
		}
	})
});
</script>



本文标签: #点击展开
整理员:xiaohei
免责声明:凡注明来源本网的所有作品,均为本网合法拥有版权或有权使用的作品,欢迎转载,注明出处。非本网作品均来自互联网,转载目的在于传递更多信息,并不代表本网赞同其观点和对其真实性负责。
生成海报
您可能在找更多

点击展开再次点击收起

    点击展开再次点击收起,话不多说,看代码

小黑 JS相关2021-11-12

怎么用js或jq点击展开,出现隐藏的DIV,点击收起DIV又隐藏起来.

    方法一:script type="text/javascript"$(function() {$("#toggle").click(function() {$(this).text($("#content").is(":hidden") ? "收起" : "展开");$("#content").slideToggle();});});/script调用a href=&

xiaohei JS相关2018-12-24

下一篇
我来说两句
抢沙发