我正在使用jQuery UI.Dialog。我有一个小问题,当我点击链接显示对话框时,#Test中的文字消失,显示模态叠加但不显示实际模态框。
使用FireBug创建了一个对话框,但是显示:无,因此不会显示。此外,如果我在firebug中将其更改为显示:阻止对话框显示但它位于我页面的左侧...有任何建议吗?
我的代码非常简单:
<head>
<link href="Vader/jquery-ui-1.7.1.custom.css" rel="stylesheet" type="text/css">
<script src="javascripts/jquery.js" type="text/javascript"></script>
<script src="javascripts/ui.core.js" type="text/javascript"></script>
<script src="javascripts/ui.draggable.js" type="text/javascript"></script>
<script src="javascripts/ui.resizable.js" type="text/javascript"></script>
<script src="javascripts/ui.dialog.js" type="text/javascript"></script>
<script type='text/javascript'>
$(function() {
$("a").click(function(){
$('#Test').css('display','inline');
$("#Test").dialog({modal: true});
});
});
</script>
</head>
<body>
<a href="#">Test</a>
<div id="Test" title="Test Title">Bla bla bla</div>
</body>
答案 0 :(得分:3)
您可能希望添加到点击是e.preventDefault();所以它不会尝试加载可能刷新页面的#。
$("a").click(function(e){
e.preventDefault();
$('#Test').css('display','inline');
$("#Test").dialog({modal: true});
});
答案 1 :(得分:0)
我的猜测是它没有拿起你的css文件,你确认它确实是吗?
据我所知,您的代码没有任何问题,以下测试适用于我的沙盒文件
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<!-- Above Doctype should provide S mode in Moz, Safari, Opera, IE8 and A (almost standards) in IE6/7 -->
<head>
<meta http-equiv="Content-Type" content="application/text+html;utf-8"/>
<title>Sandbox</title>
<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("jquery", "1.3.2");
google.load("jqueryui", "1.7.0");
</script>
<script type="text/javascript">
$(document).ready(function() {
$("a").click(function(){
$('#Test').css('display','inline');
$("#Test").dialog({modal: true});
});
});
</script>
</head>
<body>
<div id="container">
<a href="#">Test</a>
<div id="Test" title="Test Title">Bla bla bla</div>
</div>
</body>
</html>
答案 2 :(得分:0)
&LT a取代;不是块级结构,可能会造成一些麻烦。
尝试将其包装在DIV中,然后在对话框中创建该div。
答案 3 :(得分:0)
我遇到了同样的问题,结果发现没有找到CSS文件。使用firebug加载css文件。您可能会发现Firebug中显示的内容是“未找到404”。