2014-11-30 4 views
1

Вопрос:
Почему JQuery .click обработчик события для выбора ниспадающего прекрасно работают в IE и Firefox, но не Chrome?.click обработчик в Chrome против Firefox

Детали:
Я не могу получить .click обработчик событий для активации с Chrome, но он прекрасно работает с IE и Firefox. В IE и Firefox при выборе «opt1» в выпадающем меню отображается окно предупреждения. В Chrome заявление alert("Hello"); никогда не анализируется. Я запускаю Win7. Я просмотрел JQuery API documentation, но не повезло. Вот код:

<!DOCTYPE html> 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <script src="jquery-2.1.1.min.js"></script> 
    <script src="ChromeTest.js"></script>  
</head> 
<body> 
    <select> 
     <optgroup label="Some"> 
      <option id="opt1">1</option> 
      <option id="opt2">2</option> 
     </optgroup> 
    </select> 
    <input type="text" id="inputTest1" /> 
</body> 
</html> 

... со следующими JS для поддержки:

// JavaScript source code 
$(document).ready(function() { 
    var showArea = $("#inputTest1"); 
    $('#opt1').click(function() { 
     alert("Hello"); 
    }); 
}); 
+3

Есть ли конкретная причина, вы не просто слушать «изменить» событие на избранных? –

+0

Попробуйте использовать Chrome 'Console.log (« Hello »); вместо этого используйте инспектор страниц, чтобы узнать, есть ли какой-либо вывод. Просто исключить возможность блокировки предупреждения. – skibulk

+0

@skibulk Console.log проверяет, что событие .click не активируется. –

ответ

2

Об этом было спрошено еще в 2009 году на StackOverflow here.

Считайте, что событие click не учитывает выбранные с клавиатуры, и подумайте об использовании события change в теге <select>, так как вы можете получить такую ​​же информацию.

JSFiddle

$(document).ready(function() { 
    $('select').on('change', function() { 
     // If you need access to the element that was selected, use find 
     console.log($(this).find('option:selected:first').text()); 

     // If you just need the value 
     console.log($(this).val()); 
    }); 
}); 
+0

Благодарим вас за ответ. Тем не менее, ошибка по-прежнему применяется, что указано в ответе на исходный вопрос с 2009 года. Если опция уже выбрана, и пользователь нажимает на уже выбранную опцию, она не регистрируется. –

+0

Если вам не нужны события клавиатуры, используйте событие 'click' вместо события' change' в приведенном выше примере. Это активируется, даже если пользователь нажимает на уже выбранный вариант по вашему желанию. – szdc

0

Используйте этот скрипт

<script> 
$(document).ready(function() { 
$("select") 
    .change(function() { 
    var str = ""; 
    $("select option:selected").each(function() { 
     str += $(this).text() + " "; 
    }); 
    alert(str); 
    }) 
    .change(); 

}); 
    </script> 

Ваш HTML

<select> 
     <optgroup label="Some"> 
      <option id="opt1">1</option> 
      <option id="opt2">2</option> 
     </optgroup> 
    </select> 

    <input type="text" id="inputTest1" /> 
+0

Благодарим вас за ответ, но это в основном то же самое, что и ответ szds ... с той же проблемой, как я указал в своем комментарии в этом ответе. –

0

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

+0

Спасибо, что помогли сузить дело, но, к сожалению, это не относится. Console.log проверяет, что событие .click не запускается. –

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