2010-04-15 22 views
30

Muszę zabraknąć czegoś oczywistego tutaj ... Nie mogę uzyskać .change() wystrzelenia z przycisków radiowych? Mam poniższy kod na żywo here!jQuery .change() na przycisku radiowym

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>Radio Button jQuery Change</title> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     console.log("parsed"); 
     $("input[name='rdio']").change(function() { 
      console.log("changed"); 
      if ($("input[name='rdio']:checked").val() == 'a') 
       $("output").text("a changed"); 
      else if ($("input[name='rdio']:checked").val() == 'b') 
       $("output").text("b changed"); 
      else 
       $("output").text("c changed"); 
     }); 
    </script> 
</head> 
<body> 
    <div> 
     <input type="radio" name="rdio" value="a" checked="checked" /> a <br/> 
     <input type="radio" name="rdio" value="b" /> b <br/> 
     <input type="radio" name="rdio" value="c" /> c 
    </div> 
    <h3>Output:</h3> 
    <div id="output"></div> 
</body> 
</html> 

Czy ktoś może zobaczyć, co przeoczyłem?

Dzięki Denis

+8

... co najmniej '' 'na' $ ("output") '... – Leo

+0

możesz również użyć this.value zamiast" input [nazwa = 'rdio']: checked "). Val() . Będzie bardziej efektywny. – Yaroslav

+0

Oto dokument dotyczący tego kontekstu https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this – Yaroslav

Odpowiedz

41

Musisz umieścić kod wewnątrz zdarzenia dom gotowy ...

$(document).ready(function(){ 
    // Your code here 
}); 

lub inny skrypt zostanie wykonany przed HTML elementy zostały załadowane. Tak więc nie istnieją żadne radioboksy.

+1

Dziękuję bardzo za opublikowanie tego! –

15

Twój

$("output").text("a changed"); 

powinny być również

$("#output").text("a changed"); 

ponieważ jest to id jesteś dopasowywania.

Powiązane problemy