我一生都无法弄清楚如何在模式弹出框中加载外部页面。 我正在使用 http://dinbror.dk/bpopup/ 中的模式弹出框
由于我是 javascript 新手,所以我无法弄清楚文档。我可以加载一个常规的弹出框,这对我来说很容易,但是当涉及到在模态中加载ajax时,我不知道在html文档中的哪里声明它:
$('element_to_pop_up').bPopup({
contentContainer:'.content',
loadUrl: 'test.html' //Uses jQuery.load()
});
该脚本应该在弹出窗口中加载 test.html,但事实并非如此。它会加载一个空白的弹出框。
这是我尝试做的事情:
<button id="my-button">Pop it Up</button>
<div id="element_to_pop_up">
<!-- Ajax Javascript that supposed to popup in modal-->
<script>$('element_to_pop_up').bPopup({
contentContainer:'.content',
loadUrl: 'test.html' //Uses jQuery.load()
});</script>
</div>
你知道我搞砸了什么吗?
最佳答案
你很接近。您缺少的是您需要将 onclick 事件绑定(bind)到您的按钮并将其放入 $(document).ready 中,如下所示:
<script>
$(document).ready(function() {
$('#my-button').bind('click', function(e) {
// Prevents the default action to be triggered.
e.preventDefault();
// Triggering bPopup when click event is fired
$('#element_to_pop_up').bPopup({
contentContainer:'.content',
loadUrl: 'test.html' //Uses jQuery.load()
});
});
});
</script>
关于javascript - 使用模态ajax + jquery加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22083042/