Question

这个问题可能要问一百万次，但我不能让这个问题起作用。

我有3个正常创建的单选按钮。我想在第一个和第三个单选按钮之间放置一个第四个单选按钮。单击此单选按钮时，应显示第三个和第四个单选按钮，取消选中此单选按钮应使其消失。

澄清我创建了fiddle

所以我尝试的是下面的内容。我用收音机创建了一个新的div。在第一台收音机后注入它。这样可行！当我检查新创建的收音机时，第3和第4个出现。所以工作正常！问题是当我点击第一个收音机时，第二个收音机保持检查，因此第3和第4个收音机仍然可见。我认为它适用于.prop或者我显然做错了。

任何人

$(document).ready(function () {
    var newContainer = $('<div class="gui-spacer"></div><div class="gui-block-option"><div class="gui-field"><div class="gui-radio"><div class="tm-radio"><input type="radio" value="" name="shipment_method_wholesale" id="gui-form-shipping-wholesale" class=""></div><label for="gui-form-shipping-wholesale">Ik wil graag bij mijn groothandel bestellen(Afhalen)</label></div><div class="gui-field-content"><p>text over bestellen bij groothandel</p></div></div></div>');

    $('#gui-form .gui-block-option:not(:first)').hide();
    $('#gui-form-shipping-wholesale').prop('checked', false);
    $('#gui-form .gui-block-option:first').after(newContainer);


    $('input[name="shipment_method_wholesale"]').bind('change', function () {

        var showOrHide = ($(this).val() == 1) ? false : true;
        $('#gui-form .gui-block-option:not(:first) ').toggle(showOrHide);
        $(this).prop('checked', true);
    });
});

Answer 1

单选按钮按其name属性分组。如果您想确保一次只能选择一个，请确保它们具有相同的name。

我所做的只是让您的jsfiddle工作，但是更改了您动态添加到name的单选按钮的shipment_method。

var newContainer = $('<div class="gui-spacer"></div><div class="gui-block-option"><div class="gui-field"><div class="gui-radio"><div class="tm-radio"><input type="radio" value="" name="shipment_method" id="gui-form-shipping-wholesale" class=""></div><label for="gui-form-shipping-wholesale">Ik wil graag bij mijn groothandel bestellen(Afhalen)</label></div><div class="gui-field-content"><p>text over bestellen bij groothandel</p></div></div></div>');

编辑：我必须进行一些其他更改才能隐藏它并正确显示其他按钮

Answer 2

要成为同一群体的一员，您需要制作＆＃34;名称＆＃34;对于该组的所有按钮部分属性相同。

如何在javascript中检查/取消选中动态单选按钮？

2 个答案: