Question

如果我将它们放在document.ready（）函数中，函数将显示为未定义：

$(document).ready(function(){
  function foo()
  {
    alert('Bar');
  }
});

foo(); // Undefined

为什么会这样？我确信我只需要一些简单的理解：）

Answer 1

不确定为什么在ready()范围内定义函数对您很重要，但您可以通过预先声明foo来使其工作：

<html><head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
var foo;                           // Here's the difference
$(document).ready(function(){
  foo = function ()
  {
    alert('Bar');
  }
});
</script></head><body>
<input type="button" onclick="foo()" value="Click me">
</body></html>

显然，您无法在foo()之后立即从内联脚本调用ready()，因为ready()代码尚未运行，但您可以稍后调用该函数。

请确保在foo()代码运行之前没有任何内容可以尝试调用ready()（或使foo()的初始声明成为无害函数。）

Answer 2

您可以，但必须在ready()方法的范围内调用它们，否则在ready()方法退出时会失去范围。

例如，以下代码可以使用：

$(document).ready(function(){
  function foo()
  {
    alert('Bar');
  }

  foo(); // still in the scope of the ready method
});

Answer 3

如果你将它们放在任何不属于它们的范围内，它们将会被定义为未定义的。如果你真的想在$（document）.ready（...）的范围之外使用它们，那么你需要在外部声明它们。如：

var foo;

$(document).ready(function(){
  foo = function()
  {
    alert('Bar');
  }
});

foo(); // works now because it is in scope

希望这有帮助。

Answer 4

您的功能是在$(document).ready()回调范围内定义的，无法从外部看到。在$(document).ready()范围内定义仅在内部调用它的函数。

Answer 5

<script>
    $(document).ready(function(){
      myfnc = function (param1, param2)
      {
        alert('Hello');
      }
      myfnc();
    });
</script>
<input type="button" onclick="myfnc('arg1', 'arg2')" value="Click me">

Answer 6

再添一次：

在$(document).ready()函数中声明函数或变量时，在文档中使用onclick()绑定时无法访问这些函数或变量。

您可以将声明移到$(document).ready()之外，也可以在$（document）.ready（）中使用$('#element').on('click', function() {})。

为什么我不能在jQuery document.ready（）中定义函数？

6 个答案: