Как показать скрытый элемент в jquery?

Question

<script> 
$("#apick").click(
    function() { 
     $("#answer").show("slow"); 
    } 
); 
</script> 

<div id = "answer" style="display:none;" > 
    Word is: <span id = "word"></span> 
</div> 

<a href="#" id = "apick" class="pick">Trigger!</a> 

Я пытаюсь сделать попытку сделать ссылку «Триггер», чтобы показать div, ответ, но не работает. Не знаете, как это сделать.

Answer 1

Ваша подписка на событие клика должна запускаться, когда документ полностью загружен. Поэтому вы должны обернуть свой код установки в вызове $().

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

Так что ваш код становится:

<script> 
$(function() { 
    $("#apick").click(
     function() { 
      $("#answer").show("slow"); 
     } 
    ); 
}); 

</script> 

<div id = "answer" style="display:none;" > 
    Word is: <span id = "word"></span> 
</div> 

<a href="#" id = "apick" class="pick">Trigger!</a> 

Answer 2

Вы должны поместить <script>...</script> тег после ссылки, так что связь действительно существует, когда код JQuery пытается выполнить.

Answer 3

Это будет работать только если:

1. Вы загружаете JQuery первый
2. Вы делаете этот сценарий работы, когда все готово

Example here

<div id = "answer" style="display:none;" > 
    Word is: <span id = "word"></span> 
</div> 

<a href="#" id = "apick" class="pick">Trigger!</a> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("#apick").click(
    function() { 
     $("#answer").show("slow"); 
     e.preventDefault(); 
    } 
); 
}); 
</script>