我有一个链接在页index.html,我需要打开一个div位于另一个页面称为index2.html,但我不能这样做。
我的代码是:
index.html中的链接
<a href="#modal" id="open-modal">Open Modal</a>
index2.html页面内容:
<div id="modal" class="style-modal">
<a id="close_modal" href="#" title="close modal"></a>
<div id="content-modal">
<p>Content here</p>
</div>
</div>
这是我的代码在effect .js:
$(document).ready(function(){
$("#open_modal").click(function(){
$( '#modal' ).fadeIn();
$( '#bg-modal' ).fadeTo( 500, .5 );
});
$("#close_modal").click(function(){
$( '#modal, #bg-modal' ).fadeOut();
});
});
请帮帮我。
尝试使用window.location.hash:
index.html中的链接:
<a href="http://example.com/index2.html#show-modal" id="open-modal">Open Modal</a>
index2.html页面内容:
<div id="modal" class="style-modal">
<a id="close_modal" href="#" title="close modal"></a>
<div id="content-modal">
<p>Content here</p>
</div>
</div>
这是我的代码在effect .js:
function showModal() {
$( '#modal' ).fadeIn();
$( '#bg-modal' ).fadeTo( 500, .5 );
}
$(document).ready(function(){
$("#open_modal").on('click', showModal);
$("#close_modal").click(function(){
$( '#modal, #bg-modal' ).fadeOut();
});
if (window.location.hash == '#show-modal') {
showModal();
}
});
如果你试图从另一个页面加载一个div到模态,尝试使用AJAX,像这样:
小提琴: http://jsfiddle.net/hwVrN/1/