對話框不工作

-1

我有非常簡單的代碼。當有人點擊超鏈接時，我想顯示對話框。對話框不工作

<html lang="en"> 

<head> 
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script> 

<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> 

</head> 
<body> 
<form> 
    <a id='theLink' href="#">Common Questions</a> 

     <div id="dialogform1" title="Common Questions" style ="display:none"> 

     <p> this is question 1 </p> 

</div> 
    </form> 
    <script type="text/javascript"> 

$(document).ready(function() 

    { 

    $("#theLink").click(function(e) { 

     $('#dialogform1').dialog("open"); 

    }); 

    }); 

    </script> 

</body> 
</html>

但是，這不會打開先前聲明的div內容的對話框。我不知道我在這裏做錯了什麼？我花了好幾個小時才發現它爲什麼會發生，但似乎無法找到它。它需要另一隻眼睛看問題。

謝謝您花時間回答問題。

來源

2014-06-19 Vishal

你需要包括de jQuery用戶界面庫也？ – bloodyKnuckles

，我可以問爲什麼downvote這個問題？ – Vishal

更新代碼：

參考jQuery UI Dialog

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 

<html lang="en"> 
<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css" /> 
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> 
    <title></title> 
</head> 

<body> 
    <form> 
     <a href="#" id='theLink' name="theLink">Common Questions</a> 
     <div id="dialogform1" style="display:none" title="Common Questions"> 
      <p>this is question 1</p> 
     </div> 
    </form> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("#theLink").click(function (e) { 
       $('#dialogform1').dialog(); 
       $('#dialogform1').dialog("open"); 
      }); 
     }); 
    </script> 
</body> 
</html>

來源

2014-06-19 04:09:57 Okky

你必須做到以下幾點：

- include jQuery UI -- JS & CSS 
- initialize the dialog widget before trying to open

編號：

- http://jqueryui.com/dialog/

UPDATE

WORKING JS FIDDLE DEMO

PLAY WITH CODE HERE

一旦你包括jQuery UI下面的代碼是你所需要的：

$(document).ready(function() { 

    $('#dialogform1').dialog({autoOpen:false}); 

    $("#theLink").click(function(e) { 

     $('#dialogform1').dialog("open"); 

    }); 

});

的所有文件，你需要包括在這裏：

- http://code.jquery.com/

來源

2014-06-19 00:48:40 PeterKA

我很抱歉，請您指出我必須包含哪些文件/ URL /鏈接。我對jQuery相當陌生，並不知道這些東西。 – Vishal

http://jqueryui.com/給你你需要的兩個文件。 – PeterKA

其實博客現在有鏈接到你需要的文件（http://blog.jqueryui.com/）（它曾經是在頁面的底部@ jqueryui.com）...不要指向測試版文件，所以你需要的當前文章是[jQuery UI 1.10.4]（http://blog.jqueryui.com/2014/01/jquery-ui-1-10-4/） – Mottie

對話框不工作

回答

相關問題