jQuery对话框IE6和IE7挂起

Question

I'm using jquery to show a dialog box, but its causing IE6 and IE7 to hang. Suggestions anybody? Thanks

  $(""#" + this.pnlConfirmPanel.ClientID + @""").dialog(
                        {
                           autoOpen: false,
                            modal:true,
                             resizable: false,
                            draggable: false
                        })       

The line which causes it to hang is:

modal:true

Update 1 Sorry must have clarified its a asp.net page, the resulting code looks like this:

$("#ctl00_ContentPlaceHolder1_JobAdmin1_pnlConfirmPanel").dialog(
                        {
                           autoOpen: false,
                            modal:true,
                             resizable: false,
                            draggable: false
                        }) 

If I remove modal:true, the dialog box shows and closes fine in both IE6 and IE7. Its when I add the modal:true line, that causes the browser to crash...

Update 2
Thought I'd post the rest of the javascript and html, just in case somebody would like to try it out. (To simplify I shorted the long identifier I had for the panel above)

<script src="JavaScript/jquery-1.5.2.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-1.8.11.custom.min.js" type="text/javascript"></script>
<script type="text/javascript" language="javascript">

    $().ready(function () {
        $("#ConfirmPanel").dialog(
                        {
                            autoOpen: false,
                            width: 400,
                            height: 300,
                            modal: true
                        });

        $('#Button1').click(function () {
            $("#ConfirmPanel").dialog('open');
            return false;
        });
    });



</script>

<span id="lblClicked"></span>
<input type="submit" name="Button1" value="Test" id="Button1" />
<div id="ConfirmPanel" style="width: 400px; height: 200px;">
<input type="submit" name="btnClose" value="" id="btnClose" />
    <h2>
        Hello</h2>
</div>
</form>

Answer 1

I had this problem as well. By simply changing the position attribute from fixed to absolute on the "ui-widget-overlay" class, I resolved the problem.

Answer 2

I made a JS Fiddle of it:

http://jsfiddle.net/sh9qM/

Does it work in other browsers?

Have you tried earlier versions of the jQuery libraries?

EDIT: Since you have indicated that moving to an earlier version of jQuery solved the problem, perhaps you could enter it as a bug at the jQuery web site.

Answer 3

我和我的同事今天遇到了这个问题-我们的解决方案是将jQuery UI CSS文件更新为最新版本。