jquery - 按组获取单选按钮值

Question

我的单页上有一堆单选按钮，我想从选中的单选按钮中获取值

这是我的 HTML 代码

<div class="row">
//first radio button group
    <div class="col-md-1 col-xs-1 col-sm-1">&nbsp;</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="1"><br>1<!--<br>Awful--></div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="2"><br>2</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="3"><br>3</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="4"><br>4</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="5"><br>5<!--<br>Ok--></div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="6"><br>6</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="7"><br>7</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="8"><br>8</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="9"><br>9</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="10"><br>10<!--<br>Incridible--></div>
    <div class="col-md-1 col-xs-1 col-sm-1">&nbsp;</div>
</div>

我尝试过使用这样的循环

var pertanyaan1 = 1;
        var isipertanyaan1 = 0;
        $("input[name=pertanyaan1]").each(function(){

            if($("input[name=pertanyaan1][value="+pertanyaan1+"]").prop("checked","checked"))
            {
                console.log($("input[name=pertanyaan1][value="+pertanyaan1+"]").prop("checked","checked"));
                isipertanyaan1 = pertanyaan1;
                // break();
            }
            // console.log(pertanyaan1);
            pertanyaan1++;
        });

但是该代码使 if 无用.. radio 未被过滤..

如何解决这个问题？

Answer 1

无需使用循环来获取选定的单选按钮值。

只需使用:checked

$("input[name=pertanyaan1]:checked").val();

$('button').click(function(){
  console.log($("input[name=pertanyaan1]:checked").val());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="row">
//first radio button group
    <div class="col-md-1 col-xs-1 col-sm-1">&nbsp;</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="1"><br>1<!--<br>Awful--></div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="2"><br>2</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="3"><br>3</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="4"><br>4</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="5"><br>5<!--<br>Ok--></div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="6"><br>6</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="7"><br>7</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="8"><br>8</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="9"><br>9</div>
    <div class="col-md-1 col-xs-1 col-sm-1 centerText" ><input type="radio" name="pertanyaan1" value="10"><br>10<!--<br>Incridible--></div>
    <div class="col-md-1 col-xs-1 col-sm-1">&nbsp;</div>
</div>

<button>Get Selected Value</button>