按钮，将加载外部html作为中途停留？
按钮，将加载外部html作为中途停留？
提问于 2014-02-19 00:34:45
我正在尝试创建一个按钮，一旦单击，就会打开一个覆盖窗口，其中包含来自外部文件的HTML。
我曾尝试将这段代码 用这里的代码合并，但有些地方不对劲，我猜：
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Dialog - Animation</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script>
$( ".selector" ).dialog({
open: function(event, ui) {
$('#divInDialog').load('popup.html', function() {
alert('Load was performed.');
});
}
});
$( "#opener" ).click(function() {
$( "#selector" ).dialog( "open" );
});
</script>
</head>
<body>
<div class="selector"/>
<div id="divInDialog"></div></div>
<button id="opener">Open Dialog</button>
</body>
</html>回答 2
Stack Overflow用户
回答已采纳
发布于 2014-02-19 00:49:41
试试这个：(示例)
HTML:您使用过<div class="selector"/>的
<div class="selector">
<div id="divInDialog"></div>
</div>
<button id="opener">Open Dialog</button>JS:
$(function(){
$( ".selector" ).dialog({
'autoOpen':false,
open: function(event, ui) {
$('#divInDialog').load('popup.html', function() {
alert('Load was performed.');
});
}
});
$( "#opener" ).click(function() {
$( ".selector" ).dialog( "open" );
});
});您需要使用'autoOpen':false在初始化时停止自动弹出加载。另外，您已经使用了$( "#selector" ).dialog( "open" );，但是它应该是.而不是#，因为#表示id，而.表示类，还有<div class="selector">。
此外，始终将jQuery代码放在$(document).ready(function(){ //... })中，以便这些代码在DOM准备就绪时运行，这里我使用了一个快捷方式，但没有问题。
Stack Overflow用户
发布于 2014-02-19 00:40:51
当您尝试引用“opener”和“selector”元素时，它们还没有在DOM中。尝试将所有js包装到documents：http://api.jquery.com/ready/的回调中
$(document).ready(function() {
$( ".selector" ).dialog({
autoOpen: false,
open: function(event, ui) {
$('#divInDialog').load('popup.html', function() {
alert('Load was performed.');
});
}
});
$( "#opener" ).click(function() {
$( ".selector" ).dialog( "open" );
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21868582
复制相关文章
相似问题
腾讯云开发者
