кнопки на JavaScript и jQuery радио нажмите кнопку

У меня есть 2 переключателя и jQuery работает.

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

теперь с помощью кнопки я могу установить onClick для запуска функции. Как заставить переключатели запускать функцию, когда я нажимаю на один из них?

6 73
javascript jquery

6 ответов:

можно использовать .change за то, что вы хотите

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

начиная с jQuery 1.3

вам больше не нужен '@'. Правильный способ выбора:

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

Если у вас есть радио в контейнере с id = radioButtonContainerId вы все еще можете использовать onClick, а затем проверить, какой из них выбран и соответственно запустить некоторые функции:

$('#radioButtonContainerId input:radio').click(function() {
    if ($(this).val() === '1') {
      myFunction();
    } else if ($(this).val() === '2') {
      myOtherFunction();
    } 
  });
42
<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()
14

есть несколько способов сделать это. Наличие контейнера вокруг переключателей настоятельно рекомендуется независимо, но вы также можете поместить класс непосредственно на кнопки. С помощью этого 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>

вы можете выбрать класс:

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

или выберите по идентификатору контейнера:

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

в любом случае событие будет запускаться при нажатии либо переключателя, либо метки для него, хотя странно в последнем случае (выбрав "#shapeList"), нажав на кнопку label по какой-то причине дважды вызовет функцию click, по крайней мере в FireFox; выбор по классу этого не сделает.

SetShape-это функция, и выглядит так:

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

таким образом, вы можете иметь метки на кнопках, и может иметь несколько списков переключателей на той же странице, которые делают разные вещи. Вы даже можете иметь каждую отдельную кнопку в том же списке делать разные вещи, настраивая разное поведение в SetShape () на основе кнопки значение.

8

это должно быть хорошо

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

это всегда хорошо, чтобы ограничить поиск DOM. поэтому лучше также использовать родителя, чтобы весь 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
    });
3