現在我知道它已被問過,但我似乎無法讓JQUERY對話框工作。jquery對話框在MVC中不起作用
我有一個簡單的例子,我從JQUERY網站獲得,但對話框從不彈出。
我_Layout.cshtml頁
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>@ViewBag.Title - My ASP.NET MVC Application</title>
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<meta name="viewport" content="width=device-width" />
<script src="@Url.Content("~/Scripts/jquery-1.7.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery-ui-1.8.20.min.js")" type="text/javascript"></script>
<link href="@Url.Content("~/Content/themes/base/jquery.ui.all.css")" rel="stylesheet" type="text/css" />
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title">@Html.ActionLink("your logo here", "Index", "Home")</p>
</div>
<div class="float-right">
<section id="login">
@Html.Partial("_LoginPartial")
</section>
<nav>
<ul id="menu">
<li>@Html.ActionLink("Home", "Index", "Home")</li>
<li>@Html.ActionLink("About", "About", "Home")</li>
<li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>
</nav>
</div>
</div>
</header>
<div id="body">
@RenderSection("featured", required: false)
<section class="content-wrapper main-content clear-fix">
@RenderBody()
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© @DateTime.Now.Year - My ASP.NET MVC Application</p>
</div>
</div>
</footer>
@Scripts.Render("~/bundles/jquery")
@RenderSection("scripts", required: false)
</body>
</html>
我Index.cshtml頁
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
<script type="text/javascript">
$(function() {
alert("HELLO");
});
</script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog();
});
</script>
警報彈出,但該對話框並沒有任何想法,爲什麼?
編輯:做了一些編輯,現在我有這個。
<div id="dialog" title="Basic dialog">
<p>This is the default dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>
<script type="text/javascript">
$(function() {
alert("HELLO");
});
</script>
<script type="text/javascript">
$(function() {
alert("HELLO2");
});
</script>
<script type="text/javascript">
$(function() {
$("#dialog").dialog();
});
</script>
<script type="text/javascript">
$(function() {
alert("HELLO3");
});
</script>
現在,當我有三個警報,它會如果我把對話腳本上方HELLO3腳本它會顯示所有3個警報提醒HELLO和HELLO2但它從來不HELLO3 ..但是。任何想法是怎麼回事?
清除它,我發現它可以與JSFIDDLE一起使用,但我無法理解它爲什麼在我的應用程序中不起作用。我很確定這些腳本的加載是正確的,因爲如果它們不是,那麼HELLO警報不起作用。 – Claud
順便提一句,沒有錯誤,但是如果我看到我的編輯版本,如果我將對話腳本放在警報#2和#3之間,它似乎沒有達到警報#3。有任何想法嗎? – Claud
@ Claud25'alert'是jquery'ready'函數中包裝的基本js。不像「對話框」那樣,它不需要jQuery UI。檢查腳本是否正確加載並刪除任何不必要的腳本。在你的代碼示例中,你有兩個不同版本的jquery加載和兩個不同版本的jquery ui加載。清理這些。你不需要兩個。清理CSS以及。 –