javascript - jQuery document.ready 和函数放置

Question

我有一个功能:

function pickPhrase(phraseArray){
    var phraseShuffled = fyshuffle(phraseArray);
    var phrasePick = phraseShuffled[0];
    return phrasePick;
};

在 $(document).ready(function(){/*code*/}); 中，我将其分配给 html 标记中的 onClick 事件。 (是的，我知道 onClick 内联是不好的形式 - 现在我正在使用它!)

有趣的是:只有在 $(document).ready 函数之外定义 pickPhrase 时，它才有效(即:单击时执行该函数)。当它在 INSIDE 中时，chrome 控制台告诉我“ReferenceError:pickPhrase 未定义。”

但是，console.log(pickPhrase(phraseArray)); 将从 $(document).ready 内部工作，无论 phraseArray 是否有效> 是在内部或外部定义的。

那么...为什么？

Answer 1

当您在另一个函数中声明一个函数时，它对于该函数来说是本地。 “就绪”处理程序是一个函数，所以就这样了。

对于“onfoo”属性处理程序，引用的函数必须是全局的。

如果您必须以这种方式分配事件处理程序(请不要这样做)，您可以通过显式分配从“就绪”处理程序中“导出”函数:

$(function() { // don't really need $(document).ready( - just $( is enough

  function pickPhrase(phraseArray){
    var phraseShuffled = fyshuffle(phraseArray);
    var phrasePick = phraseShuffled[0];
    return phrasePick;
  };

  window.pickPhrase = pickPhrase;
});