如何摆脱不必要的JQuery弹出警报框

Question

My code is as follows:

 function loadPage(url){
   $("#wrapper").load(url, function(){
        $("#wrapper").find($('a')).each(function(){
             $(this).on('click', function(e){
                loadPage($(this).attr('href'));
                e.preventDefault();
             });
        });
    });
}

 function JQueryAlert(message,windowHeight){
if (!windowHeight) var windowHeight = 470;

$("#msgdialog").remove();

$("body").append("<div id='msgdialog'></div>"); 

thatmsg = $("#msgdialog");

$("#msgdialog").dialog({
    resizable: false,
    draggable: false,
    width: 770,
    height: windowHeight,
    context: thatmsg,
    modal: true,
    autoOpen: false,
    buttons: {
        "Cancel" : function (){
            thatmsg.dialog("close");
        },
        "OK" : function (){
            loadPage("combat.php");
        }
    }
});     

$("#msgdialog").html(message);
$("#msgdialog").dialog('open');
}

$(document).ready(function() { JQueryAlert("HELLO!", 120); });

As you can see this displays a popup alert box, and upon the user clicking OK, it loads the file combat.php. Combat.php is simply a barebones php file that echoes some debug message like "Hello world!".

Now, my problem is, upon clicking OK and combat.php loading, the first popup goes away but up comes another popup. I can get rid of it by calling document.body.remove("#ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"); in my combat.php, but this has the unwanted effect that "Hello World!" no longer displays. How do i get rid of this unwanted pop up???

Thanks for reading.

Answer 1

Use:

    "OK" : function (){
        loadPage("combat.php");
        thatmsg.dialog("close");
    }