jQuery功能代码无法正常运行

Question

I am having problems with the code below. Basically it's 2 parts in the function...

Part 1 just clicks on a submit button and Part 2 shows a dialog.

For some reason both parts run separately work but when added together in the function no dialog appears, so when together Part 2 does not run.

Syntax issue?

Here's the code:

function myfunction() { 
    $('input[type=submit]#mysubmit').click();  

    $("#info").dialog({
    autoOpen: false,
    modal: true,
    width: 400,
    zIndex: 9999999,
    resizable: false,
    buttons: [
        {
            text: "Close",
            click: function () {
                $(this).dialog("close");
            }
        }
    ]
});    
}

Update: I've tried commenting out Part 1 and the dialog still doesn't show up so it's something to do with the Dialog code ... Part 2

See below:

function myfunction() { 
    //$('input[type=submit]#mysubmit').click();   //commented out

    $("#info").dialog({
    autoOpen: false,
    modal: true,
    width: 400,
    zIndex: 9999999,
    resizable: false,
    buttons: [
        {
            text: "Close",
            click: function () {
                $(this).dialog("close");
            }
        }
    ]
});    
}

Answer 1

Try initializing and opening in 2 different places (right now, everytime you execute myfunction , the dialog gets initialized

$(document).ready(function(){
 $("#info").dialog({
    autoOpen: false,
    modal: true,
    width: 400,
    zIndex: 9999999,
    resizable: false,
    buttons: [
        {
            text: "Close",
            click: function () {
                $(this).dialog("close");
            }
        }
    ]
});    
});

function myfunction(){
    $("#info").dialog('open');
}

Answer 2

Remove autoOpen: false . This option causes the dialog to be rendered invisible at initialisation.

Another option is to add .dialog("open") at the end:

$("#info").dialog(..autoOpen: false...).dialog('open');

Comparison (3x): http://jsfiddle.net/TEN7Z/2/