Скрытое поле jquery недоступно до вызова $ (document) .ready (). - PullRequest
Новая
       19

Скрытое поле jquery недоступно до вызова $ (document) .ready ().

0 голосов
/ 15 июня 2009

( агрегировано из другого вопроса )

Тестовый код Jquery 1.3.2, запускаемый в FF3: 

<input type="hidden" value="236434" id="ixd" name='ixd' />

<script>
console.log( $('#ixd').val() );

console.log( $('#ixd') );
console.log( $("input[name='ixd']") );
console.log( $("input:hidden") );

console.log( $("input[name='ixd'][type='hidden']") );
console.log( $("input[name='ixd']").val() );

$(document).ready(function() {
    console.log( $('#ixd').val() );
    console.log( $('#ixd') );
    console.log( $("input[name='ixd']") );
    console.log( $("input:hidden") );
});
</script>

Вывод на консоль: 

undefined
[]
[]
[]
[]
undefined
236434
[input#ixd 236434]
[input#ixd 236434]
[input#ixd 236434]

Кто-нибудь может предложить какие-либо объяснения или ссылки на документацию для данных скрытых полей, недоступных до $ (document) .ready ()? Это не то, что я когда-либо испытывал, и это доставляет неприятности.

Ответы [ 5 ]

4 голосов
/ 15 июня 2009

Вопреки тому, что написали другие, ваш пример должен работать, поскольку все основные браузеры разрешают доступ к элементам, которые предшествуют исполняемому блоку скрипта. У меня не установлен Firebug, но при замене console.log() на document.writeln() ваш пример работает как положено.

Что происходит при создании следующего HTML-документа: 

<code><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<input type="hidden" value="236434" id="ixd">
<pre><script type="text/javascript">
document.writeln($('#ixd').val());
document.writeln(document.getElementById('ixd').value);
</script>
4 голосов
/ 15 июня 2009

Ну, я думаю, ты ответил на свой вопрос. Для использования document.getElementById () необходимо, чтобы дерево DOM загружалось браузером для работы API DOM (включая getElementById).

Это означает, что вы не можете быть уверены, что любой вызов getElementById будет работать правильно, пока не будет вызвана функция $ (document) .ready. Проверьте http://dean.edwards.name/weblog/2005/02/order-of-events/ для более

1 голос
/ 15 июня 2009

Если я беру ваш код (и добавляю jQuery выше), я получаю тот же вывод. Но если я изменю ваш код на следующий, он выдаст правильные результаты. Я предполагаю, что Firefox анализирует HTML в другом порядке, когда не указан html / head / body. 

<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
</head>
<body>
<input type="hidden" value="236434" id="ixd" name='ixd' />

<script>
console.log( $('#ixd').val() );

console.log( $('#ixd') );
console.log( $("input[name='ixd']") );
console.log( $("input:hidden") );

console.log( $("input[name='ixd'][type='hidden']") );
console.log( $("input[name='ixd']").val() );

$(document).ready(function() {
    console.log( $('#ixd').val() );
    console.log( $('#ixd') );
    console.log( $("input[name='ixd']") );
    console.log( $("input:hidden") );
});
</script>

</body>
</html>

Но, как сказано выше, подождите, пока документ будет готов, прежде чем пытаться получить элементы по идентификатору.

1 голос
/ 15 июня 2009

document.ready, когда страница «готова», то есть полностью обработана. Возможно, ваше скрытое поле еще не отображено на странице в данный момент в журнале запуска.

Используйте ready (), чтобы начать манипулировать элементами страницы, а не до этого, «это единственный способ быть уверенным»:)

0 голосов
/ 15 июня 2009

Вы не должны доверять ничему, пока дом не будет готов. Это просто способ, которым все работает. У вас есть проблемы с ожиданием до готовности?

...