Почему функция, объявленная в document.ready(), не определена при вызове?

Вот мой HTML/JavaScript:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
    <script type="text/javascript" src="/script/jquery.js"></script>
    <script type="text/javascript">
        $(function(){
            var $str = "hello world";

            function foo() {
                alert($str);
            }
        });
    </script>
</head>
<body>
    <form name="statusUpdateForm" method="post">
        <input type="button" name="submitButton" value=" " onclick="foo();" />
    </form>
</body>
</html>

Когда я нажимаю кнопку, я получаю сообщение об ошибке JavaScript о том, что foo не определено. Как я могу вызвать функцию JavaScript, объявленную внутри document.ready()??


person Eric Belair    schedule 25.05.2011    source источник
comment
Связанный вопрос здесь. stackoverflow.com/questions/1055767/   -  person c4il    schedule 25.05.2011


Ответы (5)


По сути, вы помещаете область действия функции в другую функцию.

Представьте это:

<script>
  document.onload = function(){
    function foo(){
      alert('bar');
    }
  };
  foo();
</script>

Это факсимиле того, чего вы пытаетесь достичь. Подобно тому, как переменные, определенные внутри функции, недоступны вне ее, имена функций приобретают те же характеристики.

Примечание JavaScript не требует использования префикса $ для имен переменных (хотя это допустимо, если речь идет об именах). Я не знал, пришли ли вы с PHP и просто привыкли или знали.

Думал сделать свой комментарий ответом.

person Brad Christie    schedule 25.05.2011

Попробуй это:

$(function() {
    window.foo = function () {
        alert('bar');
    }
});

По сути, вам нужно предоставить функцию глобальной области видимости.

person digitalbath    schedule 25.05.2011

Переменные и методы, объявленные внутри функции $(function(), доступны только внутри нее. Если вам нужно использовать их снаружи, вы делаете это в глобальном пространстве имен, например

window.functionName = functionName;
person abhilashv    schedule 31.01.2013

Вы не можете, это частное для этой области.

person Milimetric    schedule 25.05.2011
comment
Можно тоже, нужно просто скопировать функцию из области видимости. Если вы сделаете что-то вроде этого.foo = foo, или window['foo'] = foo, или что-то в этом роде, код будет работать. И это часто то, что вы хотите тоже. Хотя я бы рекомендовал использовать $('input[type=button]').click(foo); внутри готовой функции. - person Alxandr; 25.05.2011
comment
Я согласен с вашей рекомендацией, но мой ответ все еще верен, если вы обдумаете вопрос. Вы можете выставлять вещи из внутренней области видимости, указывая на них глобальные переменные области видимости, но вы все равно не можете получить к ним доступ. Это не было извинением, что не могу помочь вам ответить, это было предназначено для обучения правилам области действия. - person Milimetric; 25.05.2011

Что я в конечном итоге сделал - что я должен был сделать в первую очередь - это добавить обработчик кликов для кнопки отправки:

$("input[name='submitButton']").click(function(){...});
person Eric Belair    schedule 28.05.2011