jQuery的对话框不开放，而且似乎没有错误

Question

我觉得我得到了jQuery的进口排序是这样的：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" /> 

那么我整个的jQuery这样的代码：

<script type="text/javascript" > 
$(function() 
{ 
    $("input[type=submit]").click(function() 
    { 
     var name = $("#problem_name").val(); 
     var problem_blurb = $("#problem_blurb").val(); 

     var dataString = 'problem_name='+ name + '&problem_blurb=' + problem_blurb; 

     if(name=='' || problem_blurb == '') 
     { 
      $('.success').fadeOut(200).hide(); 
      $('.error').fadeOut(200).show(); 
     } 
     else 
     { 
      $.ajax({ 
       type: "POST", 
       url: "/problems/add_problem.php", 
       dataType: "json", 
       data: dataString, 
       success: function(json) 
       { 
        $('.success').fadeIn(200).show(); 
        $('.error').fadeOut(200).hide(); 

        // Here can update the right side of the screen with the newly entered information 
        //alert (json); 

        new_string = "<h2>Most Recently Added Problems</h2>"; 

        // Have to figure out how to make this work with the DOM. 
        for (var i = 0, l = json.length; i < l; ++i) 
        { 
         title = json[i]['problem_title']; 
         member_id = json[i]['creator_member_id']; 
         description = json[i]['problem_description']; 
         problem_date = json[i]['problem_date']; 
         upvotes = json[i]['upvotes']; 
         downvotes = json[i]['downvotes']; 
         problem_id = json[i]['problem_id']; 

         new_string = new_string + "<p>Problem name: <a href='http://www.problemio.com/problems/problem.php?problem_id=" + problem_id + "'>" + title + "</a></p>"; 

         new_string = new_string + "<p>Problem description: " + description + "</p>"; 
         new_string = new_string + "<p>Entered date " + problem_date + "</p>"; 

         new_string = new_string + "<a href='/problems/edit_problem.php?problem_id=" + problem_id + "'>Edit</a>"; 

         new_string = new_string + "<hr />";            

        } 

        $("#recent_problems").replaceWith(new_string) ;         
       } 
      }); 
     } 

     return false; 
    }); 
}); 
</script> 

<script type="text/javascript"> 
$(document).ready(function() 
{ 
    var $dialog = $('<div></div>') 
     .html('This dialog will show every time!') 
     .dialog({ 
      autoOpen: false, 
      title: 'Basic Dialog' 
     });   


    $('.vote_up').click(function() 
    {   
     problem_id = $(this).attr("data-problem_id"); 

     var dataString = 'problem_id='+ problem_id + '&vote=+'; 

     $.ajax({ 
       type: "POST", 
       url: "/problems/vote.php", 
       dataType: "json", 
       data: dataString, 
       success: function(data) 
       {   
        // ? :) 
        alert (data); 
       }, 
       error : function(data) 
       { 
        //alert("ajax error, json: " + data.responseText); 
        errorMessage = data.responseText; 

        if (errorMessage == "not_logged_in") 
        { 
         alert ("errr"); 

         // Try to create the popup that asks user to log in. 

         //$(".dialog").dialog(); 
         $dialog.dialog('open'); 
         // prevent the default action, e.g., following a link 
         return false; 
        } 
        else 
        { 
         alert ("not"); 
        } 

        //alert(JSON.stringify(data)); 
       } 
      }); 


     //Return false to prevent page navigation 
     return false; 
    }); 

    $('.vote_down').click(function() 
    { 
     alert("down"); 

     problem_id = $(this).attr("data-problem_id"); 

     var dataString = 'problem_id='+ problem_id + '&vote=-';   

     //Return false to prevent page navigation 
     return false; 
    });  
}); 
</script> 

当在这个页面上：http://www.problemio.com我按下“upvote”链接，我没有弹出jQuery对话框。没有错误。但是有$ dialog.dialog（'open'）的行;应该打开我的对话框，对吧？

或者是我有两个地方检查文档是否准备好了吗？我粘贴了我的整个jQuery代码，以防我犯了一些新手错误。

谢谢！

Answer 1

你不包括jQuery UI CSS，正如我在链接中看到的那样，对话框出现，但没有格式化。

包括在头部分线路（更好的JS文件包含前使用）：

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/black-tie/jquery-ui.css" rel="stylesheet" type="text/css" /> 

也请关闭您script标签正确

替换：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" /> 

带：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" ></script> 

Answer 2

您在DOM中创建了一个DIV，但您永远不会将其添加到现有结构中。试试这个：

var $dialog = $('<div>'); 
$('body').append($dialog);