Question

就像标题所说我无法获得单选按钮的选中值，即使在调试器中我可以看到它，并且已经检查了

screenshot

我显然做错了什么，但我不知道它是什么。有什么帮助吗？

谢谢！

代码：

function setupViewAll() {
        var comparisonCount = 0;
        var maxComparisonCount = 3;
        var $compareLabels = $('.compare-label');
        $compareLabels.addClass('compare-label-visible');

        // Check if the checkboxes are checked on load (in case the user navigates back), and if they are increase the check count.
        $compareLabels.each(function(index, label) {
            var radioButton = $(label).find('.radio-input');
            // Only show tooltip on unchecked checkboxes.
            if(radioButton.checked) {
                comparisonCount++;
                console.log(comparisonCount);
                checkSetToolTip($compareLabels, comparisonCount, maxComparisonCount);
            }
        });

        $('.infinit-view-all').click(function (e) {
            console.log("click in view all.");
            var $parent = $(e.target).parent();

            if ($parent.hasClass('compare-label')) {
                var radioButton = $parent.find('radio-input'); // this was the error, I needed '.radio-input', instead of 'radio-input'.
                console.log(radioButton);
                if (radioButton !== undefined) {
                    // If comparisonCount > maxComparisonCount, prevent click from bubbling up.
                    alert(radioButton.is(":checked"));
                    if (comparisonCount == maxComparisonCount) {
                        e.preventDefault();
                    }
                }
            }
        });

Answer 1

这是基本代码。与代码结合起来并不难。

$('#element').click(function() {
   if($('#radio_button').is(':checked')) { alert("it's checked"); }
});

尝试

function setupViewAll() {
        var comparisonCount = 0;
        var maxComparisonCount = 3;
        var $compareLabels = $('.compare-label');
        $compareLabels.addClass('compare-label-visible');

        // Check if the checkboxes are checked on load (in case the user navigates back), and if they are increase the check count.
        $compareLabels.each(function(index, label) {
            var radioButton = $(label).find('.radio-input');
            // Only show tooltip on unchecked checkboxes.
            if(radioButton.checked) {
                comparisonCount++;
                console.log(comparisonCount);
                checkSetToolTip($compareLabels, comparisonCount, maxComparisonCount);
            }
        });

        $('.infinit-view-all').click(function (e) {
            console.log("click in view all.");
            var $parent = $(e.target).parent();

            if ($parent.hasClass('.compare-label')) {
                var radioButton = $parent.find('.radio-input');
                console.log(radioButton);
                if (radioButton !== undefined) {
                    // If comparisonCount > maxComparisonCount, prevent click from bubbling up.
                      if($parent.find('.radio-input').is(':checked')) { alert("it's checked"); }
                    if (comparisonCount == maxComparisonCount) {
                        e.preventDefault();
                    }
                }
            }
        });

Answer 2

要提取值，您必须选择具有相同名称的所有潜在单选按钮，并将其过滤到已检查的内容，即使用:checked。然后，您可以使用.val()获取该特定单选按钮的值。

jQuery(function($) {
    $('#check').click(function() {
        alert($('input[name="the-super-radio"]:checked').val());
    });
});

<input type="radio" name="the-super-radio" value="1" />
<input type="radio" name="the-super-radio" value="2" />
<input type="radio" name="the-super-radio" value="3" />

<button id="check">Check</button>

在制作中，您可能应该进一步优化您的选择器，以确保只是在页面上包含多个具有相同名称的元素。

jQuery无法获得radiobutton正确的检查值

2 个答案: