2 qq 27608761 qq_27608761 于 2015.07.22 09:34 提问

jquery的slideToggle方法的实现问题

由于我的读取的数据数据库中读出来的,要想实现的效果是一条信息点击出现时,另一条已点击出现的条目就隐藏,怎么实现最好能有范例,求各位慷慨解囊

4个回答

showbo
showbo   Ds   Rxr 2015.07.22 11:56
已采纳
 <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script>
<style>
    ul.news div{display:none }
</style>
<ul class="news" id="ulNews">
 <li><a href="#">new1</a><div>news1新闻详细内容</div></li>
 <li><a href="#">new2</a><div>news1新闻详细内容</div></li>
 <li><a href="#">new3</a><div>news1新闻详细内容</div></li>
 <li><a href="#">new4</a><div>news1新闻详细内容</div></li>
</ul>
<script>
    $('#ulNews a').click(function () {
        $(this).next().slideToggle();
        $(this).closest('li').siblings().find('div').slideUp();
        return false
    });
</script>
CSDNXIAON
CSDNXIAON   2015.07.22 09:37

jQuery 效果 - slideToggle() 方法
jQuery 效果 - slideToggle() 方法
jquery中使用slideToggle方法
----------------------同志你好,我是CSDN问答机器人小N,奉组织之命为你提供参考答案,编程尚未成功,同志仍需努力!

danielinbiti
danielinbiti   Ds   Rxr 2015.07.22 09:54
 <html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
  $(".btn1").click(function(){
      $('#msgdiv').append("<p id='msg2'>msg2</p>");
      $("#msg1").slideToggle();
  });
});
</script>
</head>
<body>
<div id='msgdiv'>
  <p id='msg1'>msg1</p>
</div>
<button class="btn1">Toggle</button>
</body>
</html>
sina_2831808769
sina_2831808769   Rxr 2015.07.25 14:01

ul.news div{display:none }
  • new1
    news1新闻详细内容
  • new2
    news1新闻详细内容
  • new3
    news1新闻详细内容
  • new4
    news1新闻详细内容
$('#ulNews a').click(function () { $(this).next().slideToggle(); $(this).closest('li').siblings().find('div').slideUp(); return false });
Csdn user default icon
上传中...
上传图片
插入图片