jQueryアコーディオンがアクティブになったときに最初にクリックした後にアコーディオンが壊れる

私のサイトでちょっとだけjQueryアコーディオンがあったし、今日チェックして壊れてしまうまでうまくいきました。私は数週間でHTMLに触れていません。私はaccordion documentationを何度も繰り返してきましたが、何も変わっていないようですので、何が起こっているのか分かりません。jQueryアコーディオンがアクティブになったときに最初にクリックした後にアコーディオンが壊れる

アコーディオンのアクティブなプロパティが "false"に設定されているため、アコーディオンはドキュメントの読み込み時にアクティブなセクションを表示しませんでした。私はまた指定されたドキュメントのように "折り畳み可能"を "true"に設定しました。ページ上の別の要素ではないことを確かめるために、私は基本的なアコーデオン要素だけを持つ全く新しいページを作成しましたが、それでも機能しません。

問題は、最初のアコーディオンセクションをクリックした後、他のアコーディオンセクションをクリックしても機能しないということです。そのセクションが開いている状態です。私は "アクティブ"プロパティを削除するとこの問題は完全に解決されたことに気がつきましたが、当然、ドキュメントロード時にアクティブなセクションが開かれています。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
<script> 
    $(document).ready(function() { 
    $("#accordion").accordion({active: false, alwaysOpen: true, autoHeight: false, collapsible: true}); 
    }); 
</script> 
</head> 
<body> 
<div id="accordion"> 

    <p><a href="#">1</a></p> 
    <div>this</div> 

    <p><a href="#">2</a></p> 
    <div>isn't</div> 

    <p><a href="#">3</a></p> 
    <div>working</div> 

    <p><a href="#">4</a></p> 
    <div>correctly</div> 

</div> 
</body> 
</html>

また、私はアクティブ削除するとことに気づい：偽の、および折りたたみ可能なままに：本当、私は二回「崩壊」のセクションを、そしてセクションはロックアップし、崩壊停止happens-その後、同じものにできています/開く。あなたは自動的にjQueryとjQuery UIの両方の最新バージョンを務めてしまいますrevision（バージョンの最後の3桁目）を指定しないことで

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

：

出典

2011-01-13 Sean

まあ、私はすぐに次のような問題を見ました。それで、なぜjQuery UIが更新され、UIアコーディオンに変更が加えられたのかが突然あなたのために機能しなくなったのです。

これを解決する最も良い方法は、リビジョンを指定することです。現在のバージョン（1.8.7）から下に向かってあなたのために働くまで歩きます。たとえば、alwaysOpenの公開は削除または変更されています。 docsを確認し、利用可能なオプションを確認する必要があります。

また、あなたは私がjsFiddleに取り組んで持っている、これを試すことができます。

$(function(){ 
    $("#accordion").accordion({ 
     active: false, 
     autoHeight: false, 
     collapsible: true 
    }); 
});

出典

2011-01-13 23:59:14 mekwall

おかげで、！私は次回のバージョン番号を覚えています。 – Sean

アコーディオンと各パネルの高さをコントロールし

heightStyleType

。可能な値：

「自動」：すべてのパネルが最も高いパネルの高さに設定されます。
"fill"：アコーディオンの親の高さに基づいて利用可能な高さに拡大します。
"コンテンツ"：各パネルのコンテンツの高さが同じになります。

コード例：勤務

$(function(){ 
    $("#accordion").accordion({ 
     active: false, 
     heightStyle: "content", 
     collapsible: true 
    }); 
});

出典

2014-12-18 08:41:12 yubase

jQueryアコーディオンがアクティブになったときに最初にクリックした後にアコーディオンが壊れる

答えて

関連する問題