我想在右侧片段位于网址时显示两个模式,因此domain.com#steg2
加载模态#steg2和domain.com#steg3
加载模态#steg3。
我的剧本:
$(function() {
if (window.location.hash.indexOf("steg2") !== -1) {
$("#steg2").modal();
}
if (window.location.hash.indexOf("steg3") !== -1) {
$("#steg3").modal();
}
});
这就是我的模态的构建方式:
<div class="modal fade" id="steg2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal fade" id="steg3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
两个模态都位于同一页面/ URL上。我究竟做错了什么?网站正在使用bootstrap 3和jQuery。
答案 0 :(得分:3)
经过一些试验后,我发现这段代码可以完成这项工作:
<script type="text/javascript">
jQuery(document).ready(function($) {
var target = document.location.hash.replace("#", "");
if (target.length) {
if(target=="steg1"){
$('#steg1').modal('show');
}
else if(target=="steg2"){
$('#steg2').modal('show');
}
else if(target=="steg3"){
$('#steg3').modal('show');
}
}
else{
}
});
</script>
答案 1 :(得分:1)
我建议:
function hashModal () {
var stegs = ['steg2','steg3'],
hash = window.location.hash,
stegAt = stegs.indexOf(hash.replace('#','');
if (stegAt > -1) {
$(hash + '.modal').modal();
}
}
$(document).on('ready hashchange', hashModal);
参考文献:
on()
。答案 2 :(得分:0)
首先使用window.location.hash
从网址获取哈希值。该值将以#为前缀。然后你可以直接将它用作jquery选择器。
var hash = window.location.hash;
if(hash != '') {
$(hash).modal();
}