MVC jqueryUI模式對話框

所以在我所有失敗的嘗試讓jQueryUI工作，我試過這個例子here從jQueryUI網站下載主題後。MVC jqueryUI模式對話框

這裏是我的代碼看我的asp.net mvc頁面上面的鏈接中的例子。

<link type="text/css" href="<%= Url.Content("~/Scripts/jquery-ui/css/smoothness/jquery-ui-1.8.17.custom.css")%>" rel="stylesheet" />  
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-ui/js/jquery-1.7.1.min.js")%>"></script> 
<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery-ui/js/jquery-ui-1.8.17.custom.min.js")%>"></script> 



<script> 

$('#dialog_link').click(function(){ 
    $('#Dialog').dialog('open'); 
    return false; 
}); 


</script> 

<p id="dialog_link">Open Dialog</p> 


<div id="Dialog" title="Dialog title!"> 
This content shown within dialog... 

</div>

按F5後，我本來期望看到點擊它會彈出一個模式對話框與[X]按鈕將其關閉，並回到主窗口時，可點擊文本。但是我能看到這是在頁面加載，在一個普通的形式

screenshot of mvc application

，其中文本「打開對話框」不響應點擊事件和所謂的「模態對話框」已經可見字符串和沒有任何格式。那麼jQueryUI的所有魔力去哪兒了？我的鏈接正確的腳本有問題嗎？完全失去。請幫忙..

編輯這個完全相同的代碼在純html模式下工作在不同的文件。當我將這段代碼複製到內容標記內的我的asp.net mvc頁面時，我在非描述行處得到一個javascript錯誤！

來源

2012-02-23 user20358

您在頁面上看到的JavaScript錯誤是什麼？我懷疑你的jQueryUI路徑不正確。 – 2012-02-23 17:51:12

根本沒有javascript錯誤...路徑是正確的。但是那些我應該鏈接的正確文件？ – user20358 2012-02-23 17:51:57

http://jqueryui.com/demos/dialog/教程是更好，最新;） – MikeSW 2012-02-23 18:01:56

就採取 '開放' 你的$（ '＃對話'）的對話（ '開放'）。你很好走。

編輯：添加此的jsfiddle與您的代碼爲例：

http://jsfiddle.net/DoomHamster/LhJsL/1/

而且，你不需要點擊，沒有默認點擊事件的元素時，「返回false」。

編輯：從您的評論下面我懷疑你是第一個加載jQuery和jQueryUI的問題。嘗試用以下內容替換腳本和css鏈接，以消除路徑問題：

<link type="text/css" rel="Stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/ui-lightness/jquery-ui.css" /> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>

來源

2012-02-23 17:59:25

點擊事件不起作用。在應用樣式 – user20358 2012-02-23 18:10:35

@ user20358之後，對話框現在不可見，對話框在顯示之前應該是不可見的。 .dialog（）方法將使其可見。只要點擊不工作，你是否在瀏覽器控制檯中收到任何js錯誤？你的代碼與你發佈的代碼有很大不同嗎？因爲在我的jsFiddle中使用該代碼似乎工作。如果代碼是相同的，我懷疑一個路徑問題阻止你的js文件加載。 – 2012-02-23 20:00:55

@ user20358查看我的編輯上面的測試，以確保您正在正確加載庫。 – 2012-02-23 20:20:24

試試這個

$(function() 
{ 
    $('#dialog_link').click(function(){ 
    $('#Dialog').dialog(); 
    return false; 
    }); 
})

來源

2012-02-23 17:58:22 MikeSW

MVC jqueryUI模式對話框

回答

相關問題