Document.ready with/without 函数，并在现有代码中添加一个数组

Question

我认为这是一个真正的新手问题，所以感谢您帮助我学习。我正在尝试实施客户端 Google 分析实验正在按照步骤 here 进行。

我一直这样用document.ready

$( document ).ready(function() {
  // Handler for .ready() called.
});

这里的说明推荐这个（没有功能）：

$(document).ready(
  // Execute the chosen view
  pageVariations[chosenVariation]
);

我想在实验之外的同一页面上调用其他一些函数，但是当我尝试将它们组合成一个 document.ready 时，google 分析实验不会运行。所以我有两个问题：

什么时候可以不包含 function 和 document.ready？查看文档here，我从来没有看到它写的没有功能所以不是我不清楚这个

将 pageVariations[chosenVariation] 添加到我现有的 document.ready 的正确方法是什么？我已经尝试将它添加到我的代码中，如下所示，但实验只有在它自己的内部时才有效，单独 document.ready。

        <script>
            var chosenVariation = cxApi.chooseVariation();
            var pageVariations = [
              function() {
                console.log('variation one');
              }, 
              function() { 
                document.getElementById('hero').src = 'heroB.jpg';
                document.getElementById('oval').src = 'es_03b.jpg';
                console.log('variation two');

              }
            ];
            $(document).ready(function () { 
                pageVariations[chosenVariation];
                about();
                truck();
                $("#vid").click(function() {    
                    $.fancybox({
                        autoSize: false,
                        inline:true, 
                        height: 456,
                        width: 700,
                        href:"#cab"
                        });
                    }); 
            });         
        </script>

Answer 1

pageVariations对象的属性是函数。因此在第一个示例中，它起作用是因为您将引用传递给要在 document.ready 上执行的函数。在第二种情况下，您使用的是匿名函数，您再次使用该函数的引用，但不将其分配给变量或执行该函数。要执行后者，您需要在调用后加上方括号 - ()。试试这个：

$(document).ready(function () { 
    pageVariations[chosenVariation]();
    // rest of your code...
});

Answer 2

When is it OK not to include function with document.ready? Looking at the documentation here, I don't ever see it written without function so not I'm not clear on this

$(document).ready(function(){
   // Something here
});

和

var a = function() {
   // Something here
};
$(document).ready(a);

或

$(function(){
   // something here
});

完全一样。

简而言之，只要第一个参数是一个函数（无论是否被引用）通过外部变量加载它是绝对没问题的.

澄清一下：在第一种情况下（和第三种情况下）你使用了一个匿名函数，而在第二种情况下你引用通过变量的函数。

你在你的情况下正在做什么：

// Wait for the DOM to load, then execute the view for the chosen variation.
$(document).ready(
  // Execute the chosen view
  pageVariations[chosenVariation]
);

与第二点（变量a）基本相同，但不是通过变量引用它，而是通过数组引用它。

接下来，关于你的秒点，因为你在一个函数中并且你没有引用它，你应该执行那个函数以使其工作，所以，而不是的：

$(document).ready(function(){
    pageVariations[chosenVariation];
            about();
            truck();
            $("#vid").click(function() {    
                $.fancybox({
                    autoSize: false,
                    inline:true, 
                    height: 456,
                    width: 700,
                    href:"#cab"
                    });
                }); 
});

替换：

pageVariations[chosenVariation];

有：

pageVariations[chosenVariation]();

编辑：

正如上面 Ted 所指出的，有多个文档就绪调用也完全没问题，因此，如果您遇到问题，也可以这样做：

$(document).ready(
  // Execute the chosen view
  pageVariations[chosenVariation]
);

$(document).ready(function(){
   // The rest of your code here
});

Document.ready with/without 函数，并在现有代码中添加一个数组

Document.ready with/without function, and adding an array to existing code

javascript

jquery

google-analytics