jQuery .click() и alert() issues

Question

Я новичок в jQuery, и у меня есть несколько вопросов. Этот jsFiddle показывает, что я испытываю: http://jsfiddle.net/rE2FH/5/ Обратите внимание, как кнопка ничего не делает.

То, что я пытаюсь сделать, это установить кнопку прослушивания кликов на кнопку и заставить ее сделать предупреждение() ;. Тем не менее, ни событие click, ни alert() не работают.

Я пробовал событие click как .click(), .on(), .delegate() и .live(), ни один из которых не работает. Что касается предупреждения, я не могу найти ничего, кроме эквивалента: «Он автоматически работает, если вы делаете» alert ([sting]); '! " Я знаю, что .click() для 1.7+, .live() обесценивается, и даже тогда предпочтительнее .delegate().

В моем текущем проекте я использую jsp со сценарием <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> ОДНАКО, он тоже не работает в jsFiddle. Эта версия отлично работает на некоторых наших других страницах (события alert и .click), но по какой-то причине у меня в настоящее время работает проблема. Я сделал все, что мог, чтобы подражать этим другим страницам, но я, возможно, что-то пропустил. Парень, который написал, что jQuery больше не работает с нашей компанией.

Я уже искал SO, и ни один из этих результатов не работали для меня:

jQuery .click() not functioning

jQuery .click() problem

jquery button not respond to click method

jquery click event issues

+ другие, которые все вместе те же линии.

Любое понимание будет оценено по достоинству.

Answer 1

У вас было несколько вопросов. Убедитесь, что вы проверяете консоль javascript на наличие ошибок. Вот рабочая версия:

http://jsfiddle.net/LxuVy/

$(document).ready(function(){ 
    $(document).delegate('#but', 'click', buttonClick); 

    function buttonClick() { 
     $('#res').hide().html("BUTTON!!!").fadeIn('fast'); 
     alert("Hello!"); 
    } 
}); 

Чтобы сломать проблемы с вашими:

$(document).ready(function(){ 
    $.delegate('#but', 'click', buttonClick()); 

    function buttonClick(){ 
     $('#res').hide().html("BUTTON!!!").fadeIn('fast'); 
     alert("Hello!"); 
    }; // this semi-colon shouldn't be here 
}; // missing closing paren for ready() 

delegate используется так:

$('selector').delegate(...) 

Хотя delegate() был заменен по on() , который должен использоваться вместо этого.

Также buttonClick() должно быть buttonClick. Когда вы добавляете круглые скобки, вы выполняете , выполняя функцию. То, что вы хотите сделать в этом случае, - передать функцию в качестве параметра.

Answer 2

Несколько проблем.

Прежде всего, необходимо выбрать элемент с делегированным (ближайшим статическим родителю)

$(document).delegate(...) 

Функции в параметре не должен закончить с Braket

$(document).delegate('#but', 'click', buttonClick); 

И вам не хватает закрывающую скобку.

Fiddle: http://jsfiddle.net/rE2FH/18/

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

$('#but').click(buttonClick); 

Кроме того, делегированы осуждается, вы должны использовать .on().

Answer 3

Я вижу три проблемы:

1. .delegate также не рекомендуется, вы должны использовать .on. Вы также называете это неправильно, прямо на $. Наконец, you're not actually delegating the event to any ancestor, так что вы можете очень хорошо использовать .click.

2. Вместо передачи ссылки функции при связывании события вы вызываете функцию (вы передаете buttonClick() вместо buttonClick).

3. Вы забыли закрыть круглые скобки в конце, вызывая синтаксическую ошибку (всегда проверяйте консоль браузера, она будет показывать такую ​​ошибку).

фиксируя все, что ваш код будет:

$(document).ready(function(){ 

    // using .click instead of .delegate 
    // .on('click', buttonClick) would work too 
    $('#but').click(buttonClick); 
    // no calling parentheses -^ 

    function buttonClick(){ 
     $('#res').hide().html("BUTTON!!!").fadeIn('fast'); 
     alert("Hello!"); 
    } 
}); 
// added missing) at the end 

Answer 4

Вы пропускаете закрытие ) из document.ready:

$(document).ready(function(){ 
    $.delegate('#but', 'click', buttonClick()); 

    function buttonClick(){ 
     $('#res').hide().html("BUTTON!!!").fadeIn('fast'); 
     alert("Hello!"); 
    }; 
}); 

Я также хотел бы предложить использовать .on(), как это : http://jsfiddle.net/rE2FH/23/