如何显示一个div并隐藏所有其他 [英] how to display one div and hide all others

问题描述

我想在每个按钮上单击显示一个div，并且希望隐藏其他所有div，我可以如何操作。
$ b HTML

 < div id = a style =display：none> 1< / diV> 
< div id = b style =display：none> 2< / diV> 
< div id = c style =display：none> 3< / diV> 
< div id = d style =display：none> 4< / diV> 
 
< input type = button value = 1 id = w> 
< input type = button value = 2 id = x> 
< input type = button value = 3 id = y> 
< input type = button value = 4 id = z> 
  

JQUERY
< $（$＃$）$（'＃$'）。live（'click'，function（）{
$（'＃a'）。css（'display'，'block '）;
}）;
$ b $（'＃x'）。live（'click'，function（）{
$（'＃b'）。css（'display'，'block'）;
}）;
$ b $（'＃y'）。live（'click'，function（）{
$（'＃c'）。css（'display'，'block'）;
}）;
$ b $（'＃z'）。live（'click'，function（）{
$（'＃d'）。css（'display'，'block'）;
}）;

http://jsfiddle.net/6UcDR/

解决方案

首先隐藏所有其他div，然后显示你想要显示的那个。

$ b

  $（'#w'）。live（'click'，function（）{
 $（' div'）。hide（）; 
 $（'＃a'）。show（）; 
}）; 
  

I want to display a div on each button click and aslo want to hide the other all divs how I can do it.

HTML

<div id=a style="display:none">1</diV>
<div id=b style="display:none">2</diV>
<div id=c style="display:none">3</diV>
<div id=d style="display:none" >4</diV>

<input type=button value=1 id=w>
<input type=button value=2 id=x>
<input type=button value=3 id=y>
<input type=button value=4 id=z>

JQUERY

$​('#w').live('click', function(){
$('#a').css('display','block');
});

$('#x').live('click', function(){
$('#b').css('display','block');
});

$('#y').live('click', function(){
$('#c').css('display','block');
});

$('#z').live('click', function(){
$('#d').css('display','block');
});

​ http://jsfiddle.net/6UcDR/

解决方案

Just start by hiding all other div's, then showing the one you want to be shown.

$​('#w').live('click', function(){
    $('div').hide();
    $('#a').show();
});

这篇关于如何显示一个div并隐藏所有其他的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！