programing

jQuery에서 라디오 버튼의 이름이 모두 같을 때 어떻게 값을 얻을 수 있습니까?

javajsp 2023. 8. 22. 21:55

jQuery에서 라디오 버튼의 이름이 모두 같을 때 어떻게 값을 얻을 수 있습니까?

내 코드는 다음과 같습니다.

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

JS는 다음과 같습니다.

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

여기 JSFIDDLE이 있습니다! 버튼을 클릭할 때마다 1이 돌아옵니다. 왜요? 누가 도와주실 수 있나요?

코드에서 jQuery는 이름을 가진 입력의 첫 번째 인스턴스만 찾습니다.q12_3이 경우에 가치가 있는 것은1이름이 포함된 입력을 원하는 경우q12_3즉.

$("#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>

위의 코드는 다음을 사용하는 과 같지 않습니다..is(":checked")jQuery의 함수는 (하나의) 요소가 아닌 부울(참 또는 거짓)을 반환합니다.


이 답변은 계속해서 많은 관심을 받고 있기 때문에 바닐라 자바스크립트 스니펫도 포함할 것입니다.

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>

선택기에서 선택한 라디오 버튼을 사용하도록 지정해야 합니다.

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

선택기를 변경할 수 있습니다.

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

다른 방법도 있습니다.아래 코드로 시도

$(document).ready(function(){

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

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

데모: https://jsfiddle.net/ipsjolly/xygr065w/

$(function(){
    $("#submit").click(function(){      
        alert($('input:radio:checked').val());
    });
 });

이 스크립트 사용

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

언급URL : https://stackoverflow.com/questions/18043452/in-jquery-how-do-i-get-the-value-of-a-radio-button-when-they-all-have-the-same