单击所有单选按钮显示 div

On click of all radio button show div

我写了代码: 单击所有单选按钮后,即使未选中单个单选按钮,也只显示 div,隐藏 div。

适用于单个 ID,但如果所有添加都不起作用。

html

<li class="list-group">
    <input type="radio" id="one">
    <input type="radio" id="two">
    <input type="radio" id="three">
    <input type="radio" id="four">
</li>
<div class="chk-message16"></div>

JS

$(document).ready(function () {
    $(".chk-message16").hide();
    var Onee = $("#one, #two, #three, #four");

    Onee.change(function () {
        $(".list-group > .chk-message").show();
    });
});

你好现在试试这个

你在jquery中写错了代码,请检查并更正我们的代码。

 $(document).ready(function(){
                $(".chk-message16").hide();
                var Onee = $("#one, #two, #three, #four");
                       
   
             

                Onee.on('change', function() {       
                    if($('input[type=checkbox]:checked').length == 4){
                      $(".chk-message16").show();
                    }else{
                      $(".chk-message16").hide();
                    }
                });
            });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <li class="list-group">
    <input type="checkbox" id="one">
    <input type="checkbox" id="two">
    <input type="checkbox" id="three">
    <input type="checkbox" id="four">
    </li>
    <div class="chk-message16">hide show div</div>

FIDDLE

$(".chk-message16").hide();
var Onee = $("#one, #two, #three, #four");

Onee.change(function () {
    $(".chk-message16").show();
});

将选择器从 $(".list-group > .chk-message").show(); 更改为 $(".chk-message16").show();

已将名称添加到复选框。

FIDLE

$(".chk-message16").hide();
var Onee = $("#one, #two, #three, #four");
//var class = $('input:radio:checked').length
Onee.change(function () {
    if($(':radio:checked').length == 4)
    $(".chk-message16").show();

});

每当您想 select 多个选项时,切勿使用单选按钮。 单选按钮用于 select 从多个中选出一个。 对于多个 selection,始终使用复选框。

<input type="checkbox">

同时记下 select 一次从多个单选按钮中选出一个给它们相同的名称:

ex.
 Female:<input type="radio" name="gen" checked="checked">
 Male :<input type="radio" name="gen">