2010-04-15 4 views
30

Мне, должно быть, не хватает чего-то очевидного здесь ... Я не могу получить .change(), чтобы стрелять по радиокнопкам? У меня есть код ниже live here!jQuery .change() на радиоприемнике

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

Может ли кто-нибудь увидеть, что я пропустил?

Спасибо, Denis

+8

... по крайней мере, '#' at '$ (" output ")' ... – Leo

+0

вы также можете использовать this.value вместо этого "input [name = 'rdio']: checked"). Val() , Это будет более эффективно. – Yaroslav

+0

Вот документ о контексте 'this' https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this – Yaroslav

ответ

41

Вы должны поместить код внутри РОМ готового события ...

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

или иначе скрипт запускается на выполнение, прежде чем были загружены HTML-элементы. Таким образом, никаких радиообъектов не существует.

+1

Большое вам спасибо за публикацию этого! –

15

Ваш

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

также должны быть

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

, потому что это идентификатор вы сопоставления с.

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