javascript - 在单独的表单上查找每个选中的单选按钮值

Question

现在，我将两个充满单选按钮的表单存储在单独的 div 标签中。

我需要能够比较左右 div 标签中选中的单选按钮。

现在，我有这段代码来查找左右 div 标签中的检查值；它检查左侧 div 标签单选按钮值两次。

   $('#btn').click(function() {
        $("#right input[type='radio']:checked").each(function() {
            var idVal = $(this).attr("id");
            var rightcity = ($("label[for='"+idVal+"']").text());
            console.log(rightcity);
            $('#rightcity').text(rightcity);
        });
        $("#left input[type='radio']:checked").each(function() {
            var idVal = $(this).attr("id");
            var leftcity = ($("label[for='"+idVal+"']").text());
            console.log(leftcity);
            $('#leftcity').text(leftcity);
        });

        });

知道如何针对正确的 div 标签值专门运行此查询吗？

Answer 1

第一个:如果 radio 在左/右具有相同的组。无需循环

第二你可以试试这个

$('#btn').click(function() {
            var rightId = $("#right input[type='radio']:checked").attr("id");
            var leftId = $("#left input[type='radio']:checked").attr("id");
            var rightcity = $("label[for='"+rightId+"']").text();
            var leftcity =  $("label[for='"+leftId+"']").text();

            console.log(rightcity);
            $('#rightcity').text(rightcity);
            console.log(leftcity);
            $('#leftcity').text(leftcity);

});

也许你不需要获取 ids ..如果你的 html

<label></label>
<input type="radio"/>

你可以直接使用.prev()而不是获取id

var rightcity = $("#right input[type='radio']:checked").prev('label').text();
var leftcity = $("#left input[type='radio']:checked").prev('label').text();

如果是

<input type="radio"/>
<label></label>

使用.next()

 var rightcity = $("#right input[type='radio']:checked").next('label').text();
 var leftcity = $("#left input[type='radio']:checked").next('label').text();

以及(能够比较左右div标签中选中的单选按钮)

var rightValue = $("#right input[type='radio']:checked").val();
var leftValue = $("#left input[type='radio']:checked").val();