jquery展開/可摺疊列表不能正常工作

Question

我想在頁面上設置一個可展開/可摺疊的內容列表，並且出於某種愚蠢的原因，它不起作用。

這是所有相關的javascript：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script src="http://digitaldemo.net/forbes/wp-content/themes/forbes/js/jquery.expander.js"></script> 
<script> 
$('ul.expander li').expander({ 
    slicePoint: 50, 
    widow: 2, 
    expandEffect: 'show', 
    userCollapseText: '[^]' 
}); 
</script> 

和列表代碼：

<ul class="expander"> 
<li>Intro text <span class="read-more"><a href="#">[more link]</a></span><span class="details">and full text goes here</span></li> 
</ul> 

該網站然而，我沒有使用插件這個WP網站。我可能錯過了一些愚蠢的簡單的事情，因爲我處於一個無所不在的狀態。任何輸入都會有幫助。

這裏是頁：http://digitaldemo.net/forbes/?page_id=34

非常感謝！

Answer 1

更換

<script> 
$('ul.expander li').expander({ 
    slicePoint: 50, 
    widow: 2, 
    expandEffect: 'show', 
    userCollapseText: '[^]' 
}); 
</script> 

通過

<script> 
jQuery(document).ready(function($){ 
    $('ul.expander li').expander({ 
    slicePoint: 50, 
    widow: 2, 
    expandEffect: 'show', 
    userCollapseText: '[^]' 
    }); 
}); 
</script> 

Answer 2

你錯過了什麼沒有加載腳本時文檔做好準備。 簡單做這樣的

<script> 
    $(document).ready(function() { 
$('ul.expander li').expander({ 
    slicePoint: 50, 
    widow: 2, 
    expandEffect: 'show', 
    userCollapseText: '[^]' 
}); 
}); 
</script>