Почему эта функция jQuery click не работает?

код:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();
    });
</script>

приведенный выше код не работает. Когда я нажимаю на #clicker, он не предупреждает и не скрывает. Я проверил консоль и не получаю никаких ошибок. Я также проверил, загружается ли JQuery, и действительно это так. Поэтому не уверен, в чем проблема. Я также сделал функцию готовности документа с предупреждением, и это сработало так, что я не уверен, что делаю неправильно. Пожалуйста помочь. Спасибо!

8 80
javascript jquery clickonce onclick onclicklistener

8 ответов:

вы должны добавить код javascript в $(document).ready(function() {}); блок.

т. е.

$(document).ready(function() {
  $("#clicker").click(function () {
    alert("Hello!");
    $(".hide_div").hide();
  });
});

как документация jQuery состояния: "страница не может быть безопасно манипулировать, пока документ не будет" готов."в jQuery обнаруживает это состояние готовности для вас. Код внутри $( document ).ready() будет выполняться только после того, как объектная модель документа страницы (DOM) будет готова для выполнения кода JavaScript"

134

Я нашел лучшее решение для этой проблемы, используя ON с $(document).

 $(document).on('click', '#yourid', function() { alert("hello"); });

для id начните с см. ниже:

$(document).on('click', 'div[id^="start"]', function() {
alert ('hello'); });

наконец после 1 недели мне не нужно добавлять onclick triger. Я надеюсь, что это поможет многим людям

26

ваш код может работать без документов.ready () просто убедитесь, что ваш скрипт находится после #clicker. Проверьте это демо:http://jsbin.com/aPAsaZo/1/

идея в готовом концепте. Если вы уверены, что ваш скрипт является последней вещью на Вашей странице или после затронутого элемента, он будет работать.

<!DOCTYPE html>
<html>
<head>


<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <script src="http://code.jquery.com/jquery-latest.min.js"
        type="text/javascript"></script>
  <a href="#" id="clicker" value="Click Me!" >Click Me</a>
  <script type="text/javascript">

        $("#clicker").click(function () {
            alert("Hello!");
            $(".hide_div").hide();

        });


</script>

</body>
</html>
20

вы должны обернуть свой Javascript-код с $(document).ready(function(){});посмотреть этот JSfiddle.

JS код:

$(document).ready(function() {

    $("#clicker").click(function () {
        alert("Hello!");
        $(".hide_div").hide();    
    });
});
6

попробуйте добавить $(document).ready(function(){ к началу вашего скрипта, а затем });. Кроме того div имеет идентификатор на ней правильно, т. е., как идентификатор, а не класс и т. д.?

5

убедитесь, что на вашей кнопке (такой div или trasparent img) нет ничего, что удерживает от нажатия кнопки. Это звучит глупо, но иногда мы думаем, что jQuery не работает, и все это наполняет, и проблема заключается в позиционировании элементов DOM.

3

можно использовать $(function(){ // code });, который выполняется, когда документ готов выполнить код внутри этого блока.

$(function(){
    $('#clicker').click(function(){
        alert('hey');
        $('.hide_div').hide();
    });
});
2

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

2