2015-06-30 47 views
0

我嘗試跟隨另一個問題線程在stackoverflow但沒有結果,我得到錯誤TypeError:$(...)。accordion is not一個使用手風琴功能的功能,但對於其他功能的JQuery UI如「效果」,其效果很好。

這是我在我的head.php文件中的代碼

<h3>Our Product</h3> 
<div id="accordion"> 
    <div id="accordion"> 
    <h3>Section 1</h3> 
    <div> 
    <p>Mauris mauris ante, blandit et, ultrices a, susceros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.</p> 
    </div> 
    <h3>Section 2</h3> 
    <div> 
    <p>Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In suscipit faucibus urna. </p> 
    </div> 
    <h3>Section 3</h3> 
    <div> 
    <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. </p> 
    <ul> 
     <li>List item</li> 
     <li>List item</li> 
     <li>List item</li> 
     <li>List item</li> 
     <li>List item</li> 
     <li>List item</li> 
     <li>List item</li> 
    </ul> 
    </div> 
</div> 
</div> 
</div> 

,都jQuery和jQuery UI的裝載succesfull

<title><?php echo $title;?> | Mitra Dekor</title> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta name="description" content=""> 
<meta name="keywords" content=""> 
<meta name="author" content=""> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/bootstrap.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/font-awesome.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/owl_003.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/owl.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/owl_002.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/fonts.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/mitradekor.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css/jquery-ui');?>/jquery-ui.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css');?>/tooltipster.css" type="text/css"> 
<link rel="stylesheet" href="<?php echo base_url('assets/css/themes');?>/tooltipster-light.css" type="text/css"> 
<script src="<?php echo base_url('assets/js');?>/jquery-1.9.1.min.js" type="text/javascript"></script> 
<script src="<?php echo base_url('assets/js');?>/jquery-ui.js" type="text/javascript"></script> 

<script src="<?php echo base_url('assets/js');?>/jquery.contenthover.min.js" type="text/javascript"></script> 

,這是我的js代碼,我使用外部文件把它放在頁腳

$(function() { 
$(".owl-carousel").each(function() { 
$(this).owlCarousel({ 
    items: 10, 
    singleItem: true, 
    autoPlay: true, 
    stopOnHover: true, 
    transitionStyle: true 
}); 
}); 

**$("#accordion").accordion({ 
    heightStyle: "content" 
});** 
}); 

我的代碼有什麼問題嗎?

更新這是jsfidlle http://jsfiddle.net/a0jzt46p/

三江源

回答

0

當您下載jQuery UI時,它會提供您選擇所需的所有選項。確保你選擇了手風琴。或者你可以使用CDN與完整的文件:https://code.jquery.com/ui/1.11.3/jquery-ui.min.js

使用該文件讓它爲我工作,但你有另一個問題。有2個ID爲#accordion的div。刪除一個,並使用完整的UI文件修復了代碼。這是一個更新的jsfiddle:http://jsfiddle.net/a0jzt46p/1/

我刪除了你的OwlCarousel函數用於測試。

+0

真棒,我在下載jQuery UI時忘了選擇按照功能,謝謝隊友 –

0

可能是它涉及到是否jquery.ui庫不能與正常工作或問題越來越負載先用簡單的代碼試試這個,看看是否你發現問題

0

例如:http://jsfiddle.net/kevalbhatt18/5Lxcz2rj/

I changed jquery-ui.js because in your js .accordion function is missing so i changed .js and .css file see reference Jquery-ui-accordion

和我的HTML改變你的ID,因爲在一個頁面中不提供相同的ID兩個元素

<h3>Our Product</h3> 
    <div id="accordion"> 
     <div id="accordion1"> 
     <h3>Section 1</h3>... 
     ........................ 

相關問題