2010-05-24 3 views
0
<script language="javascript"> 
function toggle(id) { 
    alert('call'); 
    if (document.getElementById(id).style.display == "none") { 
     alert('now visible'); 
     document.getElementById(id).style.display = ""; 
    } else { 
     alert('now invisible'); 
     document.getElementById(id).style.display = "none"; 
    } 
} 
</script> 

</head> 
<body onload="toggle('image1');alert('test_body');toggle('image2')"> 

<script language="javascript"> 
alert('test_pre_function'); 
toggle('image1'); 
alert('test_after_function'); 
toggle('image2'); 
</script> 

Похож на много кода, но это довольно просто, поэтому я думаю, что у большинства из вас не будет проблем с ним. toggle() должен переключать состояние отображения разделов, содержащих изображения.Функциональные вызовы [javascript]

Когда пользователь входит на сайт, divs должны скрываться, когда все загружается, div должны отображаться. (onload)

Как ни странно, функция в теле (не в теге тела) работает только наполовину, я получаю и предупреждаю «test_pre_function», и я получаю сигнал «звонок» (из функции), но это Это. Код в теге тела работает просто отлично.

Я нахожу это странным, потому что он должен делать то же самое дважды и один раз, когда он запускается, в другой раз нет, поэтому я думаю, что, должно быть, совершил какую-то глупую ошибку.

+2

отладчик JavaScript, такие как Firebug поможет вам решить эти виды вопросов. Это позволит вам увидеть обычно скрытые ошибки Javascript. – Schwern

+0

@Schwerm: Хорошо, я обязательно посмотрю на это – Samuel

ответ

3

Сценарий выполняется, как только он разбирается. Если image1 и image2 не были проанализированы при выполнении сценария, вернет значение null, поэтому .style.display выкинет «null или нет ошибки объекта». Это объясняет, почему работают два предупреждения: выполнение останавливается на первой строке document.getElementById(id).style.display == "none".

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

<script> 
    alert(document.getElementById("image1")); // -> null 
</script> 
<img id="image1" src="some/image.jpg" /> 
<script> 
    alert(document.getElementById("image1")); // -> object 
</script> 
+0

конечно * dow * спасибо! – Samuel

0

Вам не хватает?

alert('now visible'); 
document.getElementById(id).style.display = "block"; 
+0

Нет, что работает без :) – Samuel

+0

Ответ @Samuel Andy стоит попробовать .. –

+0

Я знаю, это решение, я не могу отметить, что он ответил, хотя нужно подождать еще 2 мин. – Samuel

0

Попробуйте http://jsfiddle.net/hUDb4/

var toggle = (function() { 
    // an object to keep state for elements 
    var state = {}; 
    return function(id){ 
     document.getElementById(id).style.display = (state[id] = !state[id]) ? "none" : "block"; 
    }; 
})(); 


toggle("myid"); // none 
toggle("myid"); // block 

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

-1

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

смотри ниже

<script> 
    alert(document.getElementById("image1")); 
    <img id="image1" src="some/image.jpg" /> 
    alert(document.getElementById("image1")); 
</script> 
+0

Это фантастическая копия. –

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