Javascript 从另一页链接到手风琴的某一部分
我使用的是twitter Bootstrap 2.04,我使用的是最新的jQuery。 我正在尝试创建一个链接,从一个页面转到包含此手风琴的页面,然后激活相应的手风琴部分。 这是手风琴:Javascript 从另一页链接到手风琴的某一部分,javascript,jquery,html,twitter-bootstrap,Javascript,Jquery,Html,Twitter Bootstrap,我使用的是twitter Bootstrap 2.04,我使用的是最新的jQuery。 我正在尝试创建一个链接,从一个页面转到包含此手风琴的页面,然后激活相应的手风琴部分。 这是手风琴: <div class="accordion-group"> <div class="accordion-heading"> <a name="Alink1" class="accordion-toggle" data-toggle="c
<div class="accordion-group">
<div class="accordion-heading">
<a name="Alink1" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne">
<strong>Title</strong>
</a>
</div>
<div id="collapseOne" class="accordion-body in collapse" style="height: auto; ">
<div class="accordion-inner">
some random content
<div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a name="Alink2" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseTwo">
<strong>Title 2</strong>
</a>
</div>
<div id="collapseTwo" class="accordion-body collapse" style="height: 0px; ">
<div class="accordion-inner">
some random content 2
<div>
</div>
</div>
一些随机内容
一些随机内容2
这是链接:
<a href="page.html/#Alink2">Link to some interesting stuff</a>
由于链接到页面中的一点通常可以正常工作,我需要使用Javascript来激活它吗 您是否尝试过以下方法:
<a href="page.html#Alink2">Link to some interesting stuff</a>
是的,您需要在页面加载时手动激活它。类似于以下的方法应该可以工作:
$(document).ready(function () {
location.hash && $(location.hash + '.collapse').collapse('show');
});
此外,正如@SaadImran所指出的,这假设您链接到可折叠元素id(例如,#collapseTwo
),而不是锚中的名称(例如,#Alink2
)。谢谢您的帮助。我添加了一些功能,以便代码可以在Accordions中打开Accordions:
$(document).ready(function () {
if (location.hash){
$(location.hash).collapse('show');
$(location.hash).parents('.accordion-body').collapse('show');
}
});
您可以使用手风琴部分的位置。以下链接打开twitter引导(wordpress)手风琴上的第三个手风琴部分 链接示例: 脚本代码:
$( document ).ready(function() {
if (window.location.hash) {
var AccordionSectionNumber = window.location.hash.substring(1);
AccordionBodyID = $(".accordion .accordion-group:nth-of-type(" + AccordionSectionNumber + ") .accordion-heading a").attr('href')
if (! (typeof AccordionBodyID === "undefined")) {
$(AccordionBodyID).collapse('show');
return true;
}
}
});
这对我在twitter引导站点上的示例不起作用,因此我假设这不是默认功能。您需要将正确的jScript附加到文件,它可以正常工作。+1,您应该指出,OP需要使用链接到页面的
page.html#collapseOne
,而不是链接到accordion部分的page.html#Alink1
。