无法在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中打开弹出框

回答

相关问题