JavaScript的jQuery的单选button单击

我有2个单选button和jquery运行。

<input type="radio" name="lom" value="1" checked> first <input type="radio" name="lom" value="2"> second 

现在,用一个button,我可以设置onClick来运行一个函数。 当点击其中一个button时,单选button的function是什么?

你可以使用.change来换取你想要的东西

 $("input[@name='lom']").change(function(){ // Do something interesting here }); 

从jQuery 1.3开始

你不再需要“@”。 正确的select方法是:

 $("input[name='lom']") 

如果你的收音机在id = radioButtonContainerId的容器中,你仍然可以使用onClick,然后检查select了哪一个,并相应地运行一些function:

 $('#radioButtonContainerId input:radio').click(function() { if ($(this).val() === '1') { myFunction(); } else if ($(this).val() === '2') { myOtherFunction(); } }); 
 <input type="radio" name="radio" value="creditcard" /> <input type="radio" name="radio" value="cash"/> <input type="radio" name="radio" value="cheque"/> <input type="radio" name="radio" value="instore"/> $("input[name='radio']:checked").val() 

有几种方法可以做到这一点。 强烈build议在单选button周围有一个容器,不过,您也可以直接在button上放置一个类。 有了这个HTML:

 <ul id="shapeList" class="radioList"> <li><label>Shape:</label></li> <li><input id="shapeList_0" class="shapeButton" type="radio" value="Circular" name="shapeList" /><label for="shapeList_0">Circular</label></li> <li><input id="shapeList_1" class="shapeButton" type="radio" value="Rectangular" name="shapeList" /><label for="shapeList_1">Rectangular</label></li> </ul> 

你可以按类select:

 $(".shapeButton").click(SetShape); 

或按容器IDselect:

 $("#shapeList").click(SetShape); 

在任何一种情况下,事件都会触发单选button或标签,但在后一种情况下(通过“#shapeList”select),点击标签会由于某种原因触发点击function两次至less在FireFox; 按class级select不会这样做。

SetShape是一个函数,看起来像这样:

 function SetShape() { var Shape = $('.shapeButton:checked').val(); //dostuff } 

这样,你可以在你的button上有标签,并且可以在同一页面上有多个单选button列表来完成不同的事情。 甚至可以通过在SetShape()中根据button的值设置不同的行为,使同一个列表中的每个单独的button可以执行不同的操作。

这应该是好的

 $(document).ready(function() { $('input:radio').change(function() { alert('ole'); }); }); 

限制DOMsearch总是好的。 所以更好地使用父母,以便整个DOM不会被遍历。

这是非常快

 <div id="radioBtnDiv"> <input name="myButton" type="radio" class="radioClass" value="manual" checked="checked"/> <input name="myButton" type="radio" class="radioClass" value="auto" checked="checked"/> </div> $("input[name='myButton']",$('#radioBtnDiv')).change( function(e) { // your stuffs go here });