2013-02-21 2 views
1

В приведенном ниже коде я назначаю gobal переменную myDiv элементом jQuery. Но тогда внутри функции «test()» кажется, что переменная myDiv объявлена, но не определена. Мне нужно переназначить его $ ('myDiv'), прежде чем я смогу с ним что-нибудь сделать.jQuery переменная с использованием шаблона модуля javascript

фиктивная переменная хуг, кажется достижимым просто отлично, хотя ...

<!DOCTYPE html> 
<htm> 
<head> 
<title>Javascript Test Code</title> 
<script src="js/jquery-1.9.0.min.js"></script> 
<script> 

var App = App || (function() { 

    var myDiv = $('#myDiv'), // define a global jQuery element variable. 
     xyz = 'xyz';  // and a bogus variable as a test. 

    function test() 
    { 
    console.log('running test...','myDiv is', myDiv); // length is 0 
    console.log('xyz is ', xyz); // says xyz 

    myDiv = $('#myDiv'); // after selecting with jQuery... 

    console.log('running test...','myDiv is', myDiv); //length is 1 
    console.log('xyz is ', xyz); // still says xyz 
    } 

    return {test:test} 

}()); 

$(function(){ 

    App.test(); 

}); 

</script> 
</head> 
<body> 
<div id="myDiv"></div> 
</body> 
</html> 
+0

Это не имеет ничего общего с областью определения, переменная существует и ее значение правильно регистрируется. Для проблемы см. Дубликат [Почему метод jQuery или DOM, такой как \ getElementById \, не находит элемент?] (Http://stackoverflow.com/questions/14028959/why-does-jquery-or-a -dom-method-such-as-getelementbyid-not-find-the-element) – Bergi

ответ

2

Там нет доступа к элементам из заголовка документа, потому что ничего не отображается. Эта строка

var App = App || (function() { 

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

После запуска функции самоисследования он будет искать $('#myDiv'), но поскольку элемент не существует, он не будет найден (это всегда, почему вы получаете длину 0 для массива элементов, который соответствует селектору) ,

Позже, когда вы попытаетесь получить доступ к App, он будет уже построен.

$(function(){ 
App.test(); 
}); 

Это означает, что вызов App возвращает уже построенный App из себя выполнение функции со значениями, уже сохраненных с момента, когда она выполняется в заголовке документа.

Когда вы вызываете функцию test, отображается состояние, которое было загружено. Тем не менее, ниже в функции вы выдаете

myDiv = $('#myDiv'); // after selecting with jQuery... 

однажды уже была загружена страница (так как мы внутри Jquery готового обратного вызова уже). Это найдет элемент на странице, поскольку DOM уже был обработан и обновлен.

+0

Спасибо за ваш ответ. Я добавил функцию init() после выполнения инструкции var для выполнения глобальных назначений переменных. Я должен явно вызвать init() сначала перед тестом(), но я буду избегать таких проблем в будущем. –

0

В вашем конкретном примере кода, приведенном выше, исходный myDiv пуст, поскольку, когда объявлено приложение, DOM не полностью загружен, и поэтому длина #myDiv равна нулю.

Вы должны переместить модуль, который будет запущен после загрузки DOM, т.е. перейдите в конец сценария.

См. Пример jsFiddle - ваше назначение в порядке. http://jsfiddle.net/yWhbL/

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

  • Нет связанных вопросов^_^