jquery slideToggle不完全工作

我是新來的jquery和JavaScript，但我正在做的練習。我想創建一個簡單的點擊功能，其中顯示下面的內容。簡單的東西，你說。由於某種原因，這不是我的情況。我有一個http://jsfiddle.net/richlewis14/FRP3R/1/的例子。jquery slideToggle不完全工作

我想要做的是點擊h3元素，然後它會顯示下面的所有內容。我還想做的事情不是使用slideUp功能來首先隱藏內容，因爲在加載頁面時可以看到內容消失，這對我來說看起來有點俗氣。我是否需要在加載時隱藏div而不是slideUp？

HTML：

<div class="container"> 
     <div class="row"> 
     <div class="span4"> 
     <div class="widget"> 
     <div class="widget-header"> 
      <i class="icon-info-sign icon-large"></i> 
      <h3 class="clickme">Core</h3> 
     </div><!--/widgetheader--> 
     <div class="widget-content-box"> 
      <p>Hello</p> 


     </div><!--/widget content--> 
     </div><!--widget--> 
     </div><!--span4--><div class="container">

的JavaScript：

$(".widget-content-box > p").slideUp(); 
$("h3.clickme").click(function(){ 
    $(this).next.slideToggle("slow"); 
});

讚賞任何幫助，感謝

來源

2012-09-22 Richlewis

。在你的代碼next一個錯字應next()。還要注意，你應該先使用parent()然後next()方法（'.widget-content-box'不是你h3元素的下一個兄弟），當你隱藏p元素.widget-content-box沒有任何可見的顯示時，你應該隱藏改爲.widget-content-box。

$(document).ready(function(){ 
    $(".widget-content-box").slideUp(); // $(".widget-content-box").hide() 
    $("h3.clickme").click(function(){ 
     $(this).parent().next().slideToggle("slow"); 
    }); 
})

http://jsfiddle.net/qxnjj/

來源

2012-09-22 21:56:02 undefined

準確。解決了。 –

非常感謝您的回答和解釋，請注意這個 – Richlewis

@Richlewis歡迎您。 – undefined

你可以在這裏使用兩個功能。

你可以嘗試這樣做：

$('h3').click(function() 
{ 
    $('.contentBelowH3').slideToggle(); 
});

而且可以上下滑動使用相同的手動功能，可手動切換。

$('h3').click(function() 
{ 
if($('.contentBelowH3').visible()) 
    { 
     $('.contentBelowH3').slideUp(); 
    } 
else 
    { 
    $('.contentBelowH3').slidDown(); 
    } 
});

來源

2012-09-22 21:59:33 Randy

這種改變的jQuery：

$("h3.clickme").click(function(){ 
    $(this).parent().next().slideToggle("slow"); 
    });

，並在CSS我已經添加顯示：所以你不要有擺在首位，以效果基本show這個div沒有：

.widget-content-box{ 
border:none; 
border-radius: 5px 5px 5px 5px; 
background:white; 
**display:none;**

來源

2012-09-22 22:05:31 Pawel

jquery slideToggle不完全工作

回答

相關問題