我正在尝试根据我发送到该页面的链接打开手风琴
这是我的网址
services.html#品牌
我正在使用以下代码：
<script type="text/javascript">
$(document).ready(function(){
$('#accordion').accordion({collapsible: true,animated: 'slide',autoHeight: false,navigation: true,active : 'false'});
});
</script>
手风琴看起来像：
<div id="accordion"> <h3 id="branding"><a href="#">branding</a></h3> <div> <p>Does your business have a</p> </div> <h3><a href="#print">Print</a></h3> <div> <p>brochures</a></p> </div> </div>
任何帮助将不胜感激…
http://docs.jquery.com/UI/Accordion
解决方法
哦,我看到杰夫报告说,目前的UI版本是坏的,但我实际上有一个使用当前版本的解决方案…
HTML
<div id="accordion"> <h3><a href="#branding">branding</a></h3> <div> <p>Does your business have a</p> </div> <h3><a href="#print">Print</a></h3> <div> <p>brochures</p> </div> </div>
脚本
$(function(){
$('#accordion').accordion({
collapsible: true,navigation: true
});
// open content that matches the hash
var hash = window.location.hash;
var thash = hash.substring(hash.lastIndexOf('#'),hash.length);
$('#accordion').find('a[href*='+ thash + ']').closest('h3').trigger('click');
})
我最初使用了一个[href $= …],但是将它改成了一个[href * = …] …或者会工作
更新：navigation option was removed from jQuery UI 1.10.0,所以使用这种方法：
CSS
.accordion {
position: relative;
}
.accordion .accordion-link {
position: absolute;
right: 1%;
margin-top: 16px;
z-index: 1;
width: 12px;
height: 12px;
background: url(link.png) center center no-repeat; /* approx 12x12 link icon */
}
脚本
var hashId = 0,$accordion = $('#accordion');
if (window.location.hash) {
$accordion.children('h3').each(function(i){
var txt = $(this).text().toLowerCase().replace(/\s+/g,'_');
this.id = txt;
if (txt === window.location.hash.slice(1)) {
hashId = i;
}
});
}
$accordion.accordion({
active: hashId,animate: false,heightStyle: 'content',collapsible: true,create: function( event,ui ) {
$accordion.children('h3').each(function(i){
$(this).before('<a class="accordion-link link" data-index="' + i + '" href="#' + this.id + '"></a>');
});
$accordion.find('.accordion-link').click(function(){
$accordion.accordion( "option","active",$(this).data('index') );
});
}
});