無法在Mvc中打開彈出框

我想在第一次加載網站時使用jQuery對話框彈出窗口。但目前尚未開放。無法在Mvc中打開彈出框

這裏是代碼：

_layout： -

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 
    @Styles.Render("~/Content/css") 
    <link href="~/Content/themes/base/jquery-ui.css" rel="stylesheet" /> 
    @Styles.Render("~/bundles/jquery") 
    <script src="~/Scripts/jquery-ui-1.8.24.js"></script> 
    @Scripts.Render("~/bundles/modernizr") 
    <script> 
     $(function() { 
      alert("hi") 
      $("#dialog-modal").dialog({ 
       height:140,modal:true 
      }) 
     }); 
    </script> 
</head> 
<body> 
    @RenderBody() 
    @RenderSection("scripts", required: false) 
</body> 
</html>

索引視圖： -

<h2>Index</h2> 
<div id="dialog-modal" title="basic Title Modal"> 
    <p>This is A Test Modal</p> 
</div>

來源

2014-11-17 Foash

首先檢查你的jquery文件是否包含。 – Rahul

同意，你也應該習慣於在你的瀏覽器上使用JavaScript調試器，你當前寫的JavaScript已經壞了（如果它與你在網站上使用的是同一個），因爲你並沒有終止「 ;」所以它會停止執行。 – starlight54

@Foash這是在小提琴中工作，所以你的問題很可能是由''中包含的腳本引起的。首先，從頭部刪除除''對話框函數'之外的所有'腳本'，並且只包含'jquery-1。8 *'和'jquery-ui-1.8.24'。當你確認它像那樣開始包含其他腳本並查看錯誤發生的時候。我很確定'〜/ bundles/jquery'正在爲你加載'jquery-ui'，我的猜測是 - 第二次手動包含它的嘗試正在破壞事物。 – Leron

你面臨的問題是，因爲您加載了jQuery

之前呈現在體內的腳本，你有2個解決方案，這種情況下

1-加載標題中的jquery

例如：

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 
    @Styles.Render("~/Content/css") 
    @Styles.Render("~/Content/themes/base/css") 
    @Scripts.Render("~/bundles/modernizr") 
    @Scripts.Render("~/bundles/jquery") 
</head> 
<body> 
    @RenderBody() 

    @Scripts.Render("~/bundles/jqueryui") 
    @RenderSection("scripts", required: false) 
</body> 
</html>

index.cshtml

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 
<div id="dialog" title="basic Title Modal"> 
    <p>This is A Test Modal</p> 
</div> 
<script> 
    $(function() { 
     $("#dialog").dialog(); 
    }); 
</script>

2 - 添加腳本您輸入的部分「腳本」

例如： _layout.cshtml

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="viewport" content="width=device-width" /> 
    <title>@ViewBag.Title</title> 
    @Styles.Render("~/Content/css") 
    @Styles.Render("~/Content/themes/base/css") 
    @Scripts.Render("~/bundles/modernizr") 
</head> 
<body> 
    @RenderBody() 

    @Scripts.Render("~/bundles/jquery") 
    @Scripts.Render("~/bundles/jqueryui") 
    @RenderSection("scripts", required: false) 
</body> 
</html>

index.cshtml

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 
<div id="dialog" title="basic Title Modal"> 
    <p>This is A Test Modal</p> 
</div> 
@section scripts{ 
    <script> 
     $(function() { 
      $("#dialog").dialog(); 
     }); 
    </script> 
}

來源

2014-11-17 06:11:24 Monah

-1

如果要加載它一旦DOM準備就緒，你需要把它包在文件就緒功能內。

$(document).ready(function() { 
      alert("hi"); 
      $("#dialog-modal").dialog({ 
       height:140,modal:true 
      }); 
});

我不知道，如果你需要爲這個既jQuery和jQueryUI的腳本，也@RenderSection("scripts", required: false)我不知道它做什麼，但如果它加載腳本，最好不要讓他們在裏面堆放身體標籤。

來源

2014-11-17 04:17:25 starlight54

'$（function（）'是'$（document）.ready（）'的快捷方式。[請參閱文檔]（http://learn.jquery.com/using- jquery-core/document-ready /）。@RenderSection（）是一個佔位符，用於從視圖中呈現腳本以及它們的正確位置（緊接在關閉''標籤之前） –

我會檢查jQuery的js文件被加載OK，既然你有這兩種：

@Styles.Render("~/bundles/jquery") 
<script src="~/Scripts/jquery-ui-1.8.24.js"></script>

我會檢查，佈局頁面加載束確定通過檢查兩個layout.cs和捆綁配置。同時確保它是jquery的正確版本。作爲一個方面說明，如果可以的話，最好使用layout.cshtml，並且以這種方式加載腳本而不是硬編碼版本號 - 例如，

@Scripts.Render("~/bundles/jquery")

然後在bundle.config

public static void RegisterBundles(BundleCollection bundles) 

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
    "~/Scripts/jquery-{version}.js"));

來源

2014-11-17 04:23:49

無法在Mvc中打開彈出框

回答

相關問題