0

我在 jquery ui 对话框中有一个 dojo dijit datetextbox .. datetextbox 日历显示在对话框后面(下层)。我正在使用 ie7.. 看我下面的代码..

   <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>
</title>
<script type="text/javascript" src="jQuery/jquery-1.8.3.js" ></script>
<script type="text/javascript" src="jQuery/jquery-ui-1.9.2.custom.min.js" ></script>
<script type="text/javascript" src="dojo/dojo/dojo.js" djConfig="parseOnLoad: true, isDebug: false"></script>
<script>dojoConfig = {parseOnLoad: true}</script><script src='dojo/dojo/dojo.js'></script><script>require(["dojo/parser", "dijit/form/DateTextBox"]);</script>
<link rel="stylesheet" type="text/css" href="jQuery/jquery-ui-1.8.11.custom.css" />
<link rel="stylesheet" type="text/css" href="dojo/dojo/resources/dojo.css" />
<link rel="stylesheet" type="text/css" href="dojo/dijit/themes/claro/claro.css" />
</head>
<body class="claro">
please click the above button to show the dialog
<br>
<input type="button" id="clickme" value="Click Me"/>
    <div id="popupdialog">
        <label for="date1">Drop down Date box:</label>
<input type="text" name="date1" id="date1" value="2005-12-30" data-dojo-type="dijit/form/DateTextBox" required="true" />
    </div>
<script type="text/javascript" >
        $(document).ready(function() {
$("#popupdialog").dialog({
    width:400,
    height:200,
    modal:false,
    position:'center',
    autoOpen:false
});
$('#clickme').click(function(){
            $('#popupdialog').dialog("open");
        });
});
    </script>
</body>
</html>

请看下图:

http://i50.tinypic.com/2edzgue.jpg

解决此问题的任何解决方案

4

1 回答 1

0

我通过将zIndex:-1添加到 jQuery 对话框解决了这个问题,如下所示:

$("#popupdialog").dialog({
width:400,
height:200,
modal:false,
position:'center',
autoOpen:false,
zIndex: -1

});

于 2013-01-19T07:28:34.203 回答