web-dev-qa-db-de.com

klicke oder ändere das Ereignis im Radio mit jquery

Ich habe einige Radios auf meiner Seite und möchte etwas tun, wenn sich das aktivierte Radio ändert. Der Code funktioniert jedoch nicht im IE:

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

Und nach dem Googeln schlagen die Leute vor, stattdessen Klicken zu verwenden. Aber es funktioniert nicht.

Dies ist der Beispielcode:

<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>

Es funktioniert auch nicht im IE.

Also möchte ich wissen, was los ist?

Ich habe auch Angst, dass das Änderungsereignis erneut ausgelöst wird, wenn ich auf ein markiertes Radio klicke.

AKTUALISIEREN:

Ich kann keinen Kommentar hinzufügen, also antworte ich hier.

Ich benutze IE8 und der Link, den Furqan mir gibt, funktioniert auch nicht in IE8. Keine Ahnung warum...

84
hguser

Dieser Code hat bei mir funktioniert:

$(function(){

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

});

http://jsfiddle.net/3q29L/

111
alexl

Sie können das Namensattribut wie folgt angeben:

$( 'input[name="testGroup"]:radio' ).change(
71
Iwao Nishida

Funktioniert auch bei mir, hier ist eine bessere Lösung:

Geige Demo

<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>

Sie müssen sicherstellen, dass Sie jquery vor allen anderen Import- und Javascript-Funktionen initialisiert haben. Weil $ ist eine jquery Funktion. Sogar

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

prüft nicht, ob jquery initialisiert wurde oder nicht. Es wird dafür sorgen, dass <code> wird erst ausgeführt, nachdem alle Javascripts initialisiert wurden.

13
suhailvs

Versuchen

$(document).ready(

anstatt

$('document').ready(

oder Sie können eine Kurzform verwenden

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

Diese Syntax ist etwas flexibler, um Ereignisse zu verarbeiten. Sie können nicht nur "Änderungen" beobachten, sondern auch andere Ereignistypen können hier mit einem einzigen Ereignishandler gesteuert werden. Sie können dies tun, indem Sie die Liste der Ereignisse als Argumente an den ersten Parameter übergeben. Siehe jQuery On

Zweitens ist .change () eine Abkürzung für .on ("change", handler). siehe hier . Ich bevorzuge die Verwendung von .on () anstelle von .change, da ich mehr Kontrolle über die Ereignisse habe.

Zuletzt zeige ich einfach eine alternative Syntax, um das Ereignis an das Element anzuhängen.

0
Carlos Augusto