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

Question

我正在努力弄清楚应该如何编写使用 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>

Answer 1

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

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

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

Answer 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 调用等中使用它...