多个点击显示隐藏例子代码

JS如下:

function showoptions(id){

switch(id) {

case 0:

box=$(".neirong0");

icon=$("#icon0");

break;

case 1:

box=$(".neirong1");

icon=$("#icon1");

break;

case 2:

box=$(".neirong2");

icon=$("#icon2");

break;

}

var val = box.css("display");

if(val == ‘block‘){

icon.removeClass("icon_up");

box.css("display","none");

}else if(val == ‘none‘){

icon.addClass("icon_up");

icon.siblings().removeClass("icon_up");

box.css("display","block");

box.siblings().css("display","none");

}

}

HTML如下:

<div>

<div id="icon0"></div>

<div id="icon1"></div>

<div id="icon2"></div>

</div>

<div class="neirong>

<div class="neirong0"></div>

<div class="neirong1"></div>

<div class="neirong2"></div>

</div>

时间: 2024-10-23 23:39:06

多个点击显示隐藏例子代码的相关文章

锋利的Jquery(点击显示隐藏div)

点击显示隐藏div 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text

HTML5--》点击显示隐藏内容

<details>浏览器支持比较差,可以用JavaScript实现这种功能. 1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>js点击显示隐藏内容</title> 6 <style type="text/css" > 7 body{font-size:12px;} 8 span{f

jquery 点击显示隐藏的三种方法

jquery点击显示隐藏的三种方法,从复杂到简单.使用jquery需要引用jquery库,如右所示<script src="jquery-1.11.3.min.js"type="text/javascript"></script>. 旁边按钮随着收缩展开发生状态变化,展开+变—,收缩—变+. 收缩效果: 展开效果: 一.HTML结构(盗用网上的) <body> <!-- 收缩展开效果 --><li class=&

js 事件点击 显示 隐藏

1 <div style="position:absolute;left:40%;top:10%;border-style:dotted"> 2 <img src="zgl.jpg"/><br/> 3 <center> 4 <input type="button" value="隐藏"/> 5      6 <input type="button&qu

css样式一开始不显示,点击显示隐藏

先隐藏在字段里写style="display:none" 点击显示隐藏 $(".a").click(function(){ if($("#aa").css("display")=="none"){ $("#aa").show(); }else{ $("#aa").hide(); } }); 替换属性 先设置好class名字 $("#btn2").a

jquery点击显示隐藏块

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>点击显示块</title> <script src="script/jquery-2.1.4.js"></script>            //引入jquery模块 <style>          

显示隐藏小代码

类似控制面板的切换. 1. 2. 3. 3个按钮,点击第一个按钮的时候出来下面的div,并且字体变红,再点击一次就消失.字体还是红色.知道切换面板,点击第二个或者第三个按钮的时候,又变成最开始状态,div 消失,字体变黑. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49

js点击显示隐藏密码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

点击 显示隐藏

<body> <div class="box"> <input type="checkbox" /> <div class="toggle"></div> </div></body><script type="text/javascript" src="js/jquery-1.7.2.min.js"></s