在JQuery中打开.dialog的问题

Question

Hey guys so I have a interface where, once a user logs in their info is checked, if the user has not read TOS than the dialog box will open. My issue is, it never opens.

Code:

function run(){
    var url = '/pcg/termsofservice/termsofservice.php';
    showUrlInDialog(url);
}
    function showUrlInDialog(url){
      var tag = $("#dialog-container");
      $.ajax({
        url: url,
        success: function(data) {
          tag.html(data).dialog
          ({
              width: '100%',
                modal: true
          }).dialog('open');
        }
      });
    }
    // if user accepts
    function agree(){
        alert("Handler for .click() called.");
    }
    /******is user declines ******/
    function decline(){

     $("#dialog-container").dialog( 'close' );
     /*****run ajax to kill session of current user and return to login page ******/
      $.ajax({ url: '/PCG/termsofservice/declinedkill.php',
             data: {},
             type: 'post',
             success: function(output) {
                 window.location.replace("/PCG/mainlogin.php");
                      }
    });
    }

PHP check to see if they have not read TOS:

//GET TOS setting if any in place, if so display TOS
$TOS = $_GET['TOS'];

if ($TOS == 0){
        echo '<script type="text/javascript">'
   , 'run();'
   , '</script>';
}

In the javascript code above - "#dialog-container" is only defined if the $TOS variable is 0:

<!-- See if TOS is active, if so add these divs for the overlay -->
    <?php
        echo '<div id="dialog-container">
        </div>';
    ?>

All this works except, nothing displays.

Let me know if you have any idea whats wrong, thanks :)

Answer 1

Looks like you're calling jQuery methods before jQuery is ready. You should have you run() call inside jQuery's document.ready function.

<script type="text/javascript">
    $(document).ready(function() {
       run();
    });
</script>