Wie erhalte ich in jQuery den Wert eines Optionsfelds, wenn alle denselben Namen haben?

Hier ist mein Code:

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

Hier ist JS:

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

Hier ist JSFIDDLE ! Jedes Mal, wenn ich auf die Schaltfläche klicke, wird 1 zurückgegeben. Warum? Kann mir jemand helfen?

In Ihrem Code sucht jQuery nur nach der ersten Instanz einer Eingabe mit Namen q12_3, die in diesem Fall den Wert von hat 1. Sie wollen einen Eingang mit dem Namen q12_3, der ist :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>

Beachten Sie, dass der obige Code nicht mit der Verwendung identisch ist .is(":checked"). Die is()Funktion von jQuery gibt ein boolesches (wahr oder falsch) und kein (ein) Element zurück.

Da diese Antwort immer mehr Beachtung findet, werde ich auch ein Vanille-JavaScript-Snippet hinzufügen.

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>

In Ihrem Selektor sollten Sie außerdem angeben, dass Sie den aktivierten Radiobutton verwenden möchten:

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

Möglicherweise möchten Sie den Selektor ändern:

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

Es gibt auch einen anderen Weg. Versuchen Sie es mit dem folgenden Code

$(document).ready(function(){

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

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

DEMO : https://jsfiddle.net/ipsjolly/xygr065w/

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

Verwenden Sie dieses Skript

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