MVC 部分视图和不显眼的 jQuery/Javascript答案

【问题标题】：MVC partial views and Unobtrusive jQuery/JavascriptMVC 部分视图和不显眼的 jQuery/Javascript
【发布时间】：2011-03-21 10:03:01
【问题描述】：

我正在努力弄清楚我应该如何创作使用 jQuery 的局部视图。

例如，在下面的部分视图中，我显示了一个与 jquery 自动完成插件挂钩的文本框。

最终我希望结果旁边显示一个“X”，然后用户可以将其删除，但出于本示例的目的，所选文本只是附加到同级 div。

我的 jQuery 代码可以放在局部视图中吗，还是应该将它放在外部文件中？如果使用了外部文件，那么使用局部视图的其他开发人员需要知道应该包含外部 js 文件 - 可以吗？

我想我的问题确实是，虽然我对 jQuery 很满意（在 DOM 中查找元素，异步调用操作等），但我需要一些关于将所有这些代码放在哪里的指导不要让我陷入混乱。

我刚才输入的任何内容都有意义吗？？？？

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<script language="javascript" type="text/javascript">
$(document).ready(function() {

    $(".acEmployee").autocomplete({
        source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby"],
        select: function(event, ui) {

            $(this).siblings().append(ui.item.value);
        }
    });

});

</script>
<div><div></div><input class="acEmployee" /></div>

【问题讨论】：

自从发布这个问题后，我发现了这个stackoverflow.com/questions/3668518/…，这正是我要问的。
...还有这个stackoverflow.com/questions/247209/…

标签： javascript jquery model-view-controller

【解决方案1】：

如果 JavaScript 是“连接”代码，那么我不介意它包含在部分代码中 - 毕竟，它相关的所有内容都在那里。

如果 JavaScript 是“框架”代码并且可以在所有地方重用，并且不依赖于部分中的任何内容，那么我将它放在自己的文件中。

我就是这样做的，但我也有兴趣听听其他人的方法。

【讨论】：

【解决方案2】：

如果可能，请将所有 js 代码保存在外部 js 文件中。这样您就可以将 jquery 包含在页面底部。

对于 .net mvc 尝试类似：

       <!--try fetching jquery from CDN, if CDN is down, fallback to local-->
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
    <script type="text/javascript">
if (typeof jQuery == 'undefined') {
document.write(unescape("%3Cscript src='<%:Url.Content("~/Scripts/jquery-1.5.1.min.js")%>' type='text/javascript'%3E%3C/script%3E"));
}
    </script>
    <script type="text/javascript" language="javascript">
    var MVC_baseurl = "<%:Url.Content("~/") %>";
    </script>
    <script type="text/javascript" language="javascript" src="<%:Url.Content("~/Scripts/jquery-ui-1.8.10.custom.min.js")%>"></script>
    <script type="text/javascript" language="javascript" src="<%:Url.Content("~/Scripts/plugins.js")%>"></script>
    <asp:ContentPlaceHolder ID="BottomJavascript" runat="server">

    </asp:ContentPlaceHolder>

然后，您可以将特定于页面的内容放在内容占位符中。，您的母版页特定插件在 plugins.js 中，您可以使用

var path = MVC_baseurl + "Controller/Action"

并在您的 ajax 调用等中使用它...

【讨论】：