如何在View / PartialView中正确使用javascript命名空间

Question

我一直在玩MVC已经有一段时间了，但是自从我正在进行的项目开始风帆之后，越来越多的人被加入其中。 由于我负责黑客攻击以找到一些“最佳实践”，我对javascript的可能滥用特别警惕，并想知道什么是最好的方式让我们的观点和部分观点很好地发挥作用用javascript。

目前，我们的代码看起来像这样（仅为了简化而简化）

<script type="text/javascript">
    function DisableInputsForSubmit() {
        if ($('#IsDisabled').is(':checked')) {
            $('#Parameters :input').attr('disabled', true);
        } else {
            $('#Parameters :input').removeAttr('disabled');
        }
    }
</script>

<%=Html.SubmitButton("submit", Html.ResourceText("submit"), New With {.class = "button", .onclick = "DisableInputsForSubmit(); if ($('#EditParameters').validate().form()) {SetContentArea(GetHtmlDisplay('SaveParameters', 'Area', 'Controller'), $('#Parameters').serialize());} return false;"})%><%=Html.ResourceIcon("Save")%>

在这里，我们正在保存表单并将其发布到服务器，但如果选中复选框，我们将禁用输入，我们不想验证。

一点背景

• 请忽略Html.Resource *位，它是资源管理助手
• SetContentArea方法包装ajax调用，GetHtmlDisplay解析有关区域，控制器和操作的url
• 我们已经安装了combres来处理压缩，缩小和服务第三方库以及我已经清楚地确定为可重用的javascript

我的问题是，如果其他人在另一个级别（比如母版页或其他javascript文件）中定义了一个函数DisableInputsForSubmit ，则可能会出现问题。

网络上的很多视频（关于jQuery设计的Resig ，或者他在Google上关于javascript的好处的Douglas Crockford ）讨论了在库/框架中使用命名空间。 到目前为止这么好，但在这种情况下，它看起来有点矫枉过正。 推荐的方式是什么？ 我是不是该：

• 在命名空间内创建一个完整的框架，并在应用程序中全局引用它？ 对于像这种方法这么小的东西看起来很多工作
• 创建一个框架框架，并在我的views / partials中使用本地javascript，最终将部分内联javascript提升为框架状态，具体取决于我们的用法？ 在这种情况下，我如何干净地隔离内联JavaScript与其他视图/部分？
• 如果有问题，请不要担心并依靠UI测试来解决问题？

事实上，我认为即使我写的JS代码在一个单独的文件中也会受益于你的答案:)

Answer 1

作为安全/最佳实践，您应始终使用模块模式。 如果你也使用事件处理程序而不是将javascript推送到onclick属性，你不必担心命名冲突，你的js更容易阅读：

<script type="text/javascript">
(function() {
    // your button selector may be different
    $("input[type='submit'].button").click(function(ev) {
        DisableInputsForSubmit();

        if ($('#EditParameters').validate().form()) {  
            SetContentArea(GetHtmlDisplay('SaveParameters', 'Area','Controller'), $('#Parameters').serialize());
        } 
        ev.preventDefault();
    });

    function DisableInputsForSubmit() {
        if ($('#IsDisabled').is(':checked')) {
            $('#Parameters :input').attr('disabled', true);
        } else {
            $('#Parameters :input').removeAttr('disabled');
        }
    }
})();
</script>

如果您决定，这很容易提取到外部文件中。

编辑以回应评论：

为了使函数可重用，我只想使用命名空间，是的。 像这样的东西：

(function() {

    MyNS = MyNS || {};

    MyNS.DisableInputsForSubmit = function() {
        //yada yada
    }

})();