нажмите или измените событие на радио, используя jquery - PullRequest
83 голосов
/ 02 марта 2011

У меня есть некоторые радио на моей странице, и я хочу сделать что-то, когда проверенное радио меняется, однако код не работает в IE:

$('input:radio').change(...);

А после поиска в Google люди предлагают вместо этого нажать click . Но это не работает.

Это пример кода:

<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
        <script type="text/javascript">
            $('document').ready(
                function(){
                    $('input:radio').click(
                        function(){
                            alert('changed');   
                        }
                    );  
                }
            );

        </script>
    </head>
    <body>
        <input type="radio" name="testGroup" id="test1" />test1<br/>
        <input type="radio" name="testGroup" id="test2" />test2<br/>
        <input type="radio" name="testGroup" id="test3" />test3</br>
    </body>
</html>

Он также не работает в IE.

Итак, я хочу знать, что происходит?

Кроме того, я боюсь, что произойдет ли перезапуск события изменения, если я нажму проверенное радио?

UPDATE:

Я не могу добавить комментарий, поэтому отвечаю здесь.

Я использую IE8, и ссылка, которую Furqan дает мне, также не работает в IE8. Я не знаю почему ...

Ответы [ 5 ]

110 голосов
/ 02 марта 2011

Этот код работал для меня:

$(function(){

    $('input:radio').change(function(){
        alert('changed');   
    });          

});

http://jsfiddle.net/3q29L/

71 голосов
/ 08 сентября 2013

Вы можете указать атрибут имени как показано ниже:

$( 'input[name="testGroup"]:radio' ).change(
13 голосов
/ 02 апреля 2014

У меня тоже работает, вот лучшее решение ::

демо fiddle

<form id="myForm">
  <input type="radio" name="radioName" value="1" />one<br />
  <input type="radio" name="radioName" value="2" />two 
</form>

<script>
$('#myForm input[type=radio]').change(function() {       
    alert(this.value);
});
</script>

Вы должны убедиться, что вы инициализировали jquery превыше всегодругие функции импорта и JavaScript.Потому что $ - это jquery функция.Даже

$(function(){
 <code>
}); 

не будет проверять jquery инициализирован или нет.Это обеспечит выполнение <code> только после инициализации всех сценариев JavaScript.

7 голосов
/ 02 марта 2011

Попробуйте

$(document).ready(

вместо

$('document').ready(

или вы можете использовать сокращенную форму

$(function(){
});
0 голосов
/ 14 июня 2016

$( 'input[name="testGroup"]:radio' ).on('change', function(e) {
     console.log(e.type);
     return false;
});

Этот синтаксис немного более гибкий для обработки событий.Вы можете наблюдать не только «изменения», но и другие типы событий, которыми можно управлять здесь, используя один единственный обработчик событий.Вы можете сделать это, передав список событий в качестве аргументов первому параметру. См. JQuery On

Во-вторых, .change () является ярлыком для .on ("change", handler). Смотрите здесь .Я предпочитаю использовать .on (), а не .change, потому что у меня больше контроля над событиями.

Наконец, я просто показываю альтернативный синтаксис для присоединения события к элементу.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...