Проблемы с выбором JQuery

В основном я пытаюсь заставить #toggle_box перемещаться вниз с помощью JQuery, код ниже работает, если я просто использую document.body как селектор, однако он не работает, если #toggle - это селектор! Любые идеи почему?Проблемы с выбором JQuery

<html> 
<head> 

<title>JQuery Testage</title> 
<style> 
#toggle_box { 
display: none; 
} 
#toggle { 
background-color: #FFF000; 
border: solid; 
} 
</style> 
</head> 
<body> 

<script src="jquery-1.4.2.min.js"></script> 
<script type="text/javascript"> 
$("#toggle").click(function() { 
if ($("#toggle_box").is(":hidden")) { 
$("#toggle_box").slideDown("slow"); 
} else { 
$("#toggle_box").hide(); 
} 
}); 
</script> 

<div id="toggle">Toggle</div> 

<div id="toggle_box">This should silde using the Jquery library 1.4.2</div> 

</body> 

</html>

источник

2011-01-23 Sean

Измените код таким образом:

<script type="text/javascript"> 
$(document).ready(function() { 
    $("#toggle").click(function() { 
    if ($("#toggle_box").is(":hidden")) { 
     $("#toggle_box").slideDown("slow"); 
    } else { 
     $("#toggle_box").hide(); 
    } 
    }); 
}); 
</script>

Проблема заключается в том, что загружен яваскрипт и выполняется до загрузки toggle_box элемент. Он работает для документа body, так как - загружен перед javascript.

источник

2011-01-23 19:27:49 Lazarus

Спасибо, что объяснил, почему он не работает, глупая ошибка, которую нужно сделать действительно! : P – Sean

@Sean Вы, вероятно, обнаружите, что 99% из нас совершают ту же ошибку в какой-то момент. Важно не совершать ошибку, а учиться у нее :) – Lazarus

Дайте обработчик щелчка на $(document).ready(... обертку, и он должен работать:

$(document).ready(function() { 

    // your click handler and anything else that 
    // should run when the DOM is ready 

});

источник

2011-01-23 19:25:00 karim79

спасибо, что работаю! :) – Sean

Может быть потому, что DOM еще не готов? Попробуйте обертывание ваш скрипт в следующем фрагменте кода:

$(function() { 
    // your code here 
});

Это короткий код $(document).ready(function(){ ...}); и может быть просто то, что не хватает?

источник

2011-01-23 19:26:09

Проблемы с выбором JQuery

ответ

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