JQuery'de, hepsi aynı ada sahipken bir radyo düğmesinin değerini nasıl alabilirim?


108

İşte kodum:

<table>
   <tr>
      <td>Sales Promotion</td>
      <td><input type="radio" name="q12_3" value="1">1</td>
      <td><input type="radio" name="q12_3" value="2">2</td>
      <td><input type="radio" name="q12_3" value="3">3</td>
      <td><input type="radio" name="q12_3" value="4">4</td>
      <td><input type="radio" name="q12_3" value="5">5</td>
   </tr>
</table>
<button id="submit">submit</button>

İşte JS:

$(function(){
    $("#submit").click(function(){      
        alert($('input[name=q12_3]').val());
    });
 });

İşte JSFIDDLE ! Düğmeye her tıkladığımda 1. döndürüyor. Neden? Biri bana yardım edebilir mi?

Yanıtlar:


226

Kodunuzda jQuery, adı olan bir girdinin ilk örneğini arar q12_3, bu durumda bu durumda değeri vardır 1. Sen isimde bir giriş istiyorum q12_3olduğunu :checked.

$("#submit").click(() => {
  const val = $('input[name=q12_3]:checked').val();
  alert(val);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>
  <tr>
    <td>Sales Promotion</td>
    <td><input type="radio" name="q12_3" value="1">1</td>
    <td><input type="radio" name="q12_3" value="2">2</td>
    <td><input type="radio" name="q12_3" value="3">3</td>
    <td><input type="radio" name="q12_3" value="4">4</td>
    <td><input type="radio" name="q12_3" value="5">5</td>
  </tr>
</table>
<button id="submit">submit</button>

Yukarıdaki kodun kullanmakla aynı olmadığını unutmayın .is(":checked"). jQuery'nin is()işlevi bir boole (doğru veya yanlış) döndürür ve (bir) öğe (ler) döndürmez.


Bu yanıt çok ilgi görmeye devam ettiği için, bir vanilya JavaScript pasajı da ekleyeceğim.

document.querySelector("#submit").addEventListener("click", () => {
  const val = document.querySelector("input[name=q12_3]:checked").value;
  alert(val);
});
<table>
  <tr>
    <td>Sales Promotion</td>
    <td><input type="radio" name="q12_3" value="1">1</td>
    <td><input type="radio" name="q12_3" value="2">2</td>
    <td><input type="radio" name="q12_3" value="3">3</td>
    <td><input type="radio" name="q12_3" value="4">4</td>
    <td><input type="radio" name="q12_3" value="5">5</td>
  </tr>
</table>
<button id="submit">submit</button>


16

seçicinizde, işaretli radyo düğmesini istediğinizi de belirtmelisiniz:

$(function(){
    $("#submit").click(function(){      
        alert($('input[name=q12_3]:checked').val());
    });
 });

1
'Tanımlanmamış' bir değer alıyorum
Pavan Alapati

@PavanAlapati HTML'nizi de görmeden nedenini size söyleyemeyiz; ideal olarak, tam HTML pasajınız ve kullandığınız kodla yeni bir soru göndermelisiniz. Ancak şu durumlarda tanımsız olmanız gerekir: Seçicideki ad, radyo düğmelerinin adlarıyla eşleşmiyorsa; radyo düğmelerinin hiçbiri kontrol edilmemiştir; veya kontrol edilen radyo düğmesinin atanmış bir değeri yok.
Dennis

7

Seçiciyi değiştirmek isteyebilirsiniz:

$('input[name=q12_3]:checked').val()


7

Başka bir yol daha var. Aşağıdaki kodu deneyin

$(document).ready(function(){

      $("input[name='gender']").on("click", function() {
            alert($(this).val());
        });
});



0

bu betiği kullan

$('input[name=q12_3]').is(":checked");

4
jQuery'nin isişlevi a döndürür boolean, bu durumda bu işe yaramaz olur.
Dennis
Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.