2009-06-28 5 views
57

функции придумать, как не определено, если я помещаю их в document.ready функцию():Почему я не могу определить функции в документе jQuery document.ready()?

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

foo(); // Undefined 

Почему это происходит? Я уверен, что мне просто нужно какое-то простое понимание :)

ответ

60

Не уверен, почему определение функции с в рамках 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() безобидной функцией).

+0

Отличная идея. Спасибо, Ричи! –

+0

Что делать, если вам нужно вызвать 'foo()' с некоторыми параметрами?Как вы их передадите, и как они будут получены? –

+1

@ alonso.torres: как и любая другая функция JavaScript: 'foo = function (x, y, z) {...}' ... 'onclick =" foo (1, 2, 3) "' – RichieHindle

24

Вы можете, но они должны быть вызваны в рамках метода ready(), иначе они теряют область действия, когда выйдет метод ready().

Например, следующий код будет работать:

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

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

Есть ли способ обойти это? Изменить область? –

+8

Простой. Определите их вне области .ready (...). Я не понимаю, почему вы так привязаны к этому. Какую выгоду он может вам предложить? – Oli

+0

@ Oli, было бы лучше с точки зрения организации кода иметь возможность объявить его в области .ready(). –

4

Ваша функция определяется в пределах от $(document).ready() обратного вызова и не может быть видно из вне. Либо определите функцию вне области $(document).ready(), чтобы вызвать ее только изнутри.

5

Они появятся как неопределенные, если вы поместите их в любую сферу, которая не принадлежит им. Если вы действительно хотите использовать их за пределами $ (document) .ready (...), вам необходимо объявить их извне. Такие как:

var foo; 

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

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

Надеюсь, это поможет.

+0

Почему тогда решение Hari Om работает? –

+0

@jj_ Решение Hari Om 'работает, потому что вызов myfnc находится в той же области, в которой объявлен myfnc. – Nishan

+0

yes 'myfnc()' call is, но как насчет 'myfnc (param1, param2)' на входе событие onclick? –

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

Просто еще одно дополнение:

При объявлении функции или переменные внутри функции $(document).ready(), они недоступны при использовании onclick() привязок в документе.

Вы можете либо переместить свои объявления за пределы $(document).ready(), либо вы можете использовать $('#element').on('click', function() {}) внутри `$ (document) .ready().

Смежные вопросы