如何用JS或JQ实现点击不同的按钮出现不同的层内容
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何用JS或JQ实现点击不同的按钮出现不同的层内容相关的知识，希望对你有一定的参考价值。
参考技术A 代码这样呀：<html>
<head>
<script>
$(document).ready(function()
/********* tab setting *********/
$(".tab td:first").addClass("current");
$(".tab div:not(:first)").hide();
/********* tab event *********/
$(".tab td").click(function()
$(".tab td").removeClass("current");
$(this).addClass("current");
$(".tab div").hide();
$("." + $(this).attr("id")).fadeIn('slow');
);
$("#linkFSS").click(function()
$("#tab7").click();
);
);</script>
</head>
<body>
<div class="tab">
<table>
<tr>
<td id="tab1">租房</td>
<td id="tab2">学生宿舍</td>
</tr>
</table>
<div class="tab1">租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房租房
</div>
<div class="tab2">学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍学生宿舍
</div>
</div>
</body>
<html>
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript">
$(function()
$("div").css("display","none");
$("h1").click(function()
var obj=$(this).next("div");
$(obj).show("fast");
$(obj).siblings("div").each(function()$(this).hide();)
);
);
</script>
<style type="text/css">
#panel
border:1px;
border-color:green;
border-style:double;
background-color:#F0F8FF;
cursor:pointer;
width:100px;
height:100px;
</style>
</head>
<body>
<h1>gdgdg</h1>
<div id="1"><p>ffffffffsfsffffffffjsfojsofjsofjsofjs</p></div>
<h1>dgdgd</h1>
<div id="2"><p>afafa<br>fsfsfsfsfsfs</p></div>
<h1>hfhfhf</h1>
<div id="3"><p>fffsfsfssssssssssssssssssssssssssssssssssfffffffff</p></div>
</body>
</html>
因为span1的display原始属性是block，所以打开页面会显示span1的内容。选择不同单选按钮时，会调用不同的js方法，改变各个span的display值，来控制显示不同的内容。
如何用js或jquery实现点击事件触发键盘
当按钮被按下时，发生 keydown 事件。
keydown() 方法触发 keydown 事件，或规定当发生 keydown 事件时运行的函数。
语法
$(selector).keydown(function)
例如：
$(document).keydown(function(event)alert(event.keyCode);//弹出按键的对应值
); 参考技术A $(document).keydown(function(event) alert(event.keyCode); if(event.keyCode == '13') alert('您输入的是回车键！'); $('#hello').click(); );
以上是关于如何用JS或JQ实现点击不同的按钮出现不同的层内容的主要内容，如果未能解决你的问题，请参考以下文章