jquery显示并隐藏在同一链接上单击

Question

我有一个div,我想在链接点击上显示和隐藏.没有两个不同的链接显示和隐藏但只有一个.我用过toggle()但它不适合我..

这是代码

<a id="showhidediv">show-hide</a>
<div id="maindiv">
 <div id="innerleftdiv" style="width:49%;float:left">
 </div>
 <div id="innerrightdiv" style="width:49%;float:left">
 </div>
<div>

<script text="text/javascript">
  $().ready(function){
    $("showhidediv").click(function(){
      $("maindiv").hide()
    });
</script>

谢谢

Answer 1

以下作品.如果你无法让这个为你的特定项目工作,问题出在其他地方,而不是使用toggle方法或jQuery语法:

$(function(){
  $("a#showhidediv").click(function(){
    $("#maindiv").toggle();
  });
});

根据您的评论,您可能希望使用$ .slideToggle()代替:

$(function(){
  $("a#showhidediv").click(function(){
    $("#maindiv").slideToggle();
  });  
});

使用两个浮动元素,您可能需要稍微修改标记:

<div id="maindiv">
  <div style="width:49%;float:left;">Foo</div>
  <div style="width:49%;float:left;">Bar</div>
  <div style="clear:both"></div>
</div>

所有这些都按预期工作,如在线演示中所示:http://jsbin.com/anaxi/edit并在此演示中使用slideToggle:http://jsbin.com/anaxi/2/edit