[英]JQuery UI Dialog displaying, not working as dialog
The dialog div is displaying without the buttons being pressed, and does not appear as an overlay when I press them.对话框 div 在没有按下按钮的情况下显示,并且在我按下它们时不会显示为覆盖。 I'm tearing my hair out, so thanks in advance.我把头发扯掉了,所以提前谢谢。
Includes:包括:
<script src="js/jquery-1.5.1.min.js"></script>
<script src="js/ui/jquery.ui.core.js"></script>
<script src="js/ui/jquery.ui.widget.js"></script>
<script src="js/ui/jquery.ui.position.js"></script>
<script src="js/ui/jquery.ui.autocomplete.js"></script>
<script src="js/ui/jquery.ui.dialog.js"></script>
Css: Css:
<link rel="stylesheet" type="text/css" href="css/jquery.ui.autocomplete.
<link rel="stylesheet" type="text/css" href="css/jquery.ui.all.
<link rel="stylesheet" type="text/css" href="css/jquery.ui.theme.
<link rel="stylesheet" type="text/css" href="css/jquery.ui.dialog.css" />
Buttons: <a class="phoneadder">Stuff</a>
按钮: <a class="phoneadder">Stuff</a>
Scripts:脚本:
<script>
$( "#dialog-form" ).dialog({
autoOpen: false,
height: 300,
width: 350,
modal: true
}
);
$( ".phoneadder" ).click(function() {
$( "#dialog-form" ).dialog( "open" );
return false;
});
</script>
Dialog:对话:
<div id="dialog-form" title="Create new phone">
<p>All form fields are required.</p>
<form>
<fieldset>
...some html here
</fieldset>
</form>
</div>
Place the initializer in your document.ready, or as shorthand:将初始化程序放在您的 document.ready 中,或者作为简写:
$(function() { $("#dialog-form").dialog(autoOpen... ); } );
Alternatively, make sure your scripts are run after the div is created, so like, in the footer.或者,确保您的脚本在创建 div 之后运行,就像在页脚中一样。
Try putting your jQuery code in the $(document).ready
function like this:尝试将您的 jQuery 代码放入$(document).ready
function 中,如下所示:
$(document).ready(function () {
/// your code here
});
Try this,尝试这个,
$(function()
{
$( ".phoneadder" ).click(function() {
$( "#dialog-form" ).dialog({
height: xxx,
width: xxx,
modal: true
});
return false;
});
});
Why don't you just put the dialog function in the click event handler?你为什么不把对话框 function 放在点击事件处理程序中?
<script>
$(function()
{
$( ".phoneadder" ).click(function() {
$( "#dialog-form" ).dialog({
height: 300,
width: 350,
modal: true
});
return false;
});
});
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.