javascript jquery radyo düğmesi tıklaması

2 radyo düğmesi ve jquery çalışıyorum.

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

Şimdi, bir düğme ile onClick'i bir işlevi çalıştıracak şekilde ayarlayabilirim. Birine tıkladığımda radyo düğmelerinin bir işlevi çalıştırmasını sağlamanın yolu nedir?

Sen kullanabilirsiniz .changeistediğini için

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

jQuery 1.3 itibariyle

artık "@" işaretine ihtiyacınız yok. Doğru seçim yolu:

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

Radyolarınızı id = radioButtonContainerId olan bir konteynerde bulunduruyorsanız, yine de onClick'i kullanabilir ve ardından hangisinin seçildiğini kontrol edebilir ve buna göre bazı işlevleri çalıştırabilirsiniz:

$('#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()

Bu iyi olmalı

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

Bunu yapmanın birkaç yolu var. Radyo düğmelerinin etrafında bir kap olması ne olursa olsun şiddetle tavsiye edilir, ancak doğrudan düğmelerin üzerine bir sınıf da koyabilirsiniz. Bu HTML ile:

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

sınıfa göre seçim yapabilirsiniz:

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

veya kapsayıcı kimliğine göre seçin:

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

Her iki durumda da, olay radyo düğmesini veya etiketini tıkladığınızda tetiklenecektir, ancak ikinci durumda garip bir şekilde ("#shapeList" ile seçilerek), etikete tıklamak herhangi bir nedenle tıklama işlevini iki kez tetikleyecektir. en azından FireFox'ta; sınıfa göre seçmek bunu yapmaz.

SetShape bir işlevdir ve şuna benzer:

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

Bu şekilde, düğmelerinizde etiketler olabilir ve aynı sayfada farklı şeyler yapan birden çok radyo düğmesi listesine sahip olabilirsiniz. Hatta aynı listedeki her bir düğmenin, düğme değerine bağlı olarak SetShape () 'de farklı davranışlar ayarlayarak farklı şeyler yapmasını sağlayabilirsiniz.

DOM aramasını kısıtlamak her zaman iyidir. bir üst öğe kullanmak çok daha iyidir, böylece DOM'nin tamamı geçilmez.

ÇOK HIZLI

<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
    });