我正在一个常见问题/帮助中心页面上为我的公司。 其中一个我们所要完成的最后的事情是“最常见问题一节”，用户只需按一下这个问题，它会打开一个链接到页面的议题是和手风琴是开到正确的部分，以显示答案。
$(document).ready(function() {
function close_accordion_section() {
$('.accordion .accordion-section-title').removeClass('active')
.find('img').attr('src', 'http://www.scrubsandbeyond.com/app_themes/scrubsandbeyond/graphics/right.png');
$('.accordion .accordion-section-content').slideUp(300).removeClass('open');
}
$('.accordion-section-title').click(function(e) {
// Grab current anchor value
var currentAttrValue = jQuery(this).attr('href');
if($(this).is('.active')) {
close_accordion_section();
}else {
close_accordion_section();
$(this).find('img').attr('src', 'http://www.scrubsandbeyond.com/app_themes/scrubsandbeyond/graphics/down.png');
// Add active class to section title
$(this).addClass('active');
// Open up the hidden content panel
$('.accordion ' + currentAttrValue).slideDown(300).addClass('open');
}
e.preventDefault();
});
});
这是jQuery的用于手风琴，和完整的工作代码是在这里http://jsfiddle.net/gvolkerding/ancu6fgu/3/一个例子是，如果我们做的如何注册到顶部的问题”一收到促销电子邮件？”，那么该网页将需要用手风琴节4开来加载。 我们上面的问题了8个单独的页面，所以最好所有我必须做的就是把在查询中的链接后，它（或者你能想到的任何其他方式），以指向正确的网页/问题。 我真的很感谢提供的任何帮助，感谢大家。
在拨弄你使用的ID（例如手风琴-3）来识别，显示和隐藏手风琴节。 该ID还可以用作任何链接到你的常见问题的页面的锚。 将下面的代码在结束document.ready功能：
// current location has anchor
if(location.hash) {
// find accordion href ending with that anchor
// and trigger a click
$(".accordion-section-title[href$="+location.hash+"]").trigger('click');
}
和链接的网页会被somethink像/path/to/faq.html#accordion-3 。 当手风琴-3是你要开锚/元素ID。 注意，页也滚动到元件的与相应的ID（ 手风琴-3）的位置。 为了避免这种情况，你要么必须滚动触发后顶部的点击，否则你会使用GET参数，而不是位置散列。
更新：包括页面滚动的问题
由于下面的评论，这里包括解决方案的版本滚动到活动的问题。
if(location.hash) {
// the selector
var currentTarget = $(".accordion-section-title[href$="+location.hash+"]"),
offset = {top: 0, left: 0};
// in case we have a hit...
if(currentTarget.length) {
// trigger the click
currentTarget.trigger('click');
// get current offset (relative to document, contains left and top)
// since the selector is the question (not the answer with the id)
// this will show the question right on top
offset = currentTarget.offset();
// just in case you'll want to add some extra space do it like this:
// offset.top -= 10;
// and let the page scroll to this position
$('html, body').animate({
scrollTop: offset.top,
scrollLeft: offset.left
});
}
}
更新后的小提琴是在这里 。
你能做到这一点的方法之一是通过问题索引的查询参数。 然后，你会在你的代码获取参数值，说， qIndex然后添加以下内容：
//get question index passed via query parameter
var qIndex = .....
$('.accordion-section-title').click(function(e) {
...
})
.eq( qIndex ).trigger('click'); //<<<------------
DEMO
