1

I am trying to redirect to another page when the "OK" button of my JQuery dialog is clicked. It seems as though the JQuery function can't access the dialog defined by the JavaScript function. Any help would be appreciated! Here's my code:

$('#submitRegistration').bind('click', function() {
  $.post('verification/register.php', $('#register').serializeArray(), function(data){
      switch (data) {
          case "errMod":
              showDlg("Your attempt has been recorded. Expect the po-po any day now!");
              break;
          case "err1":
              showDlg("Username Incorrect", "The username must be at least 6 characters long");
              break;
          case "err2":
              showDlg("Password Incorrect", "Password must be at least 8 characters long");
              break;
          case "err3":
              showDlg("Database Offline", "The database is offline. Please try again later.");
              break;
          case "err4":
              showDlg("Not Unique Username", "Username has already been taken. Please choose another one");
              break;
          case "noerr":
              showDlg("Success!", "You have been registered! Click OK to continue");

                  while($('#message').dialog('isOpen')) {
                      continue;
                  }   
                          window.location = 'none.php';
                          break;
              default:                      
          }

      });



});

function showDlg(head, contents) {
      $('#message').html(contents);
      $('#message').dialog({                            
          title: head,
          modal: true,
          dragable: false,
          //resizable: false,
          show: 'slide',
          hide: 'slide',
          buttons: {
              'OK': function() { $('#message').dialog('close'); }   
          }
      });   
  }
4

1 回答 1

0

您可以尝试使用jquery-ui

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>jQuery UI Dialog - Modal message</title>
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" />
    <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    <script src="/resources/demos/external/jquery.bgiframe-2.1.2.js"></script>
    <script src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
    <link rel="stylesheet" href="/resources/demos/style.css" />
    <script>
    $(function() {
        $( "#dialog-message" ).dialog({
            modal: true,
            buttons: {
                Ok: function() {
                    $( this ).dialog( "close" );
                }
            }
        });
    });
    </script>
</head>
<body>

    <div id="dialog-message" title="Download complete">
    <p>
        <span class="ui-icon ui-icon-circle-check" style="float: left; margin: 0 7px 50px 0;"></span>
        Your files have downloaded successfully into the My Downloads folder.
    </p>
    <p>
        Currently using <b>36% of your storage space</b>.
    </p>
</div>

<p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>


</body>

于 2012-11-03T08:27:49.440 回答