下面是一个完美的手风琴代码。我不想使用hashtag,因为它打破了我们当前的网站。有没有办法使用手风琴的无标签网址? 我尝试使用"?"但是,当使用网址访问手风琴时它没有用?这有可能吗?
所以我的想法是能够在我有这样的网址时打开手风琴:
来自:test.html#Link1 To:test.html?Link1,它不一定是问号,我只是试着看,它可能是除了标签之外的任何东西。感谢
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta name="description" content="" />
<meta name="keywords" content="" />
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.3/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
var $accordion = $("#accordion").accordion({active: false, collapsible: true}),
hashId = 0;
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: true,
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') );
});
}
});
}
});
</script>
</head>
<body>
<div id="accordion">
<h3><a href="?link1">Link1</a></h3>
<div>content</div>
<h3><a href="?link2">Link2</a></h3>
<div>content</div>
</div>
</body>
</html>
答案 0 :(得分:0)
您可以使用格式为test.html?section=Link1
的网址。您只需要停止使用哈希,并提取queryString参数as explained here。结果代码如下:
<script type="text/javascript">
function getParameterByName(name) {
var match = RegExp('[?&]' + name + '=([^&]*)').exec(window.location.search);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
$(function() {
var $accordion = $("#accordion").accordion({active: false, collapsible: true}),
hashId = 0,
section = getParameterByName('section');
if (section) {
$accordion.children('h3').each(function(i){
var txt = $(this).text().toLowerCase().replace(/\s+/g,'_');
this.id = txt;
if (txt === section) {
hashId = i;
}
});
$accordion.accordion({
active: hashId,
animate: true,
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') );
});
}
});
}
});
</script>