Javascript 和 jquery 命名空间

Question

目前，我有一大堆 html + php 文件，每个文件都有一个 $(document).ready 函数。

我相信要走的路是尽可能多地将我的 JS 整理到一个文件中，并且我需要为这些函数命名。

因此，如果我有一个名为 product_edit 的 php 文件，那么我会执行以下操作:

<script type="text/javascript"> 
    $(document).ready(function(){
        productActions.documentReady(); 
    });
</script>

然后在我的单个 site_scripts 文件中，我可以执行以下操作:

var productActions = {
    documentReady: function() {
        $('#date').change(function() {
            someGlobalFunction();
            productActions.getTerms();
        });

        $('#product_id').change(function() {
            productActions.getTerms();
        }); 
    },

    getTerms: function() {
        //do something here
    }
};

首先:我是否以正确的方式解决这个问题？这种整体方法是在正确的轨道上……还是胡说八道？

其次:似乎我的 site_scripts 文件被缓存了，所以我每次对它进行任何更改时都必须清除浏览器缓存。有什么快速的方法可以解决这个问题吗？

Answer 1

无需将其包装在额外的函数中(正如评论者所说)

$(document).ready(productActions.documentReady)

有很多不同的方法来处理缓存。例如 您可能希望在文件保存时添加时间戳 (我们在构建脚本中自动执行此操作)然后应用 far-futures expires headers所以它只下载一次。

此外，对于您的命名空间，在所有大写字母中都有一个全局命名空间是很常见的做法。我在 i.TV 工作，我们做这样的事情:

window.ITV = {pages:{}}
ITV.pages.tvListings = {
   init: function() { } // basic init for page
   prop1: "bla bla bla"
} 

然后我们可以做一些幻想，在你的 php 中做这样的事情，它可以在你的所有页面上完全重复使用:

var pageName = "<?= $pageName ?>";
if (ITV.pages[pageName]) $(document).ready(ITV.pages[pageName].init);