javascript 点击按钮时，通过Jquery选中和取消选中多个单选按钮

waxmsbnn 于 2023-02-21 发布在 Java

关注(0)|答案(2)|浏览(113)

根据图像，我想检查和取消检查单选按钮，因为所有存在和所有缺席。我写了一些代码，但它只工作一次。

$(document).on('click', '#btn_all_absent', function(e){

                $("input:radio[class^=present]").each(function(i) {
                    $(this).attr('checked',false);
                });

                $("input:radio[class^=absent]").each(function(i) {
                    $(this).attr('checked',true);
                });
            }); 

            $(document).on('click', '#btn_all_present', function(e){
                
                $("input:radio[class^=absent]").each(function(i) {
                    $(this).attr('checked',false);
                });

                $("input:radio[class^=present]").each(function(i) {
                    $(this).attr('checked',true);
                });
            });

请指出我哪里错了.

JavaScript

来源：https://stackoverflow.com/questions/75499240/on-click-button-check-and-uncheck-multiple-radio-buttons-via-jquery

2条答案

按热度按时间

niknxzdl1#

您的代码在这方面运行良好。

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.3/jquery.min.js"></script>
  </head>
  <body>
    <div>
      <button id="btn_all_present"></button>
      <input type="radio" class="present" />
      <input type="radio" class="present" />
      <input type="radio" class="present" />
      <input type="radio" class="present" />
      <input type="radio" class="present" />
      <input type="radio" class="present" />
      <input type="radio" class="present" />
    </div>
    <br />
    <button id="btn_all_absent"></button>
    <div>
      ABSENT
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
      <input type="radio" class="absent" />
    </div>
  </body>
  <script>
    $(document).on("click", "#btn_all_absent", function (e) {
      $("input:radio[class^=present]").each(function (i) {
        $(this).attr("checked", false);
      });

      $("input:radio[class^=absent]").each(function (i) {
        $(this).attr("checked", true);
      });
    });

    $(document).on("click", "#btn_all_present", function (e) {
      $("input:radio[class^=absent]").each(function (i) {
        $(this).attr("checked", false);
      });

      $("input:radio[class^=present]").each(function (i) {
        $(this).attr("checked", true);
      });
    });
  </script>
</html>

赞(0）回复(0）举报 2023-02-21

shstlldc2#

对我来说就是这样。

$(document).on('click', '#btn_all_absent', function(e){
                $("input:radio[class^=present]").prop('checked', false);
                $("input:radio[class^=absent]").prop('checked', true);
            });

            $(document).on('click', '#btn_all_present', function(e){
                $("input:radio[class^=absent]").prop('checked', false);
                $("input:radio[class^=present]").prop('checked', true);
            });

赞(0）回复(0）举报 2023-02-21

我来回答

javascript 点击按钮时，通过Jquery选中和取消选中多个单选按钮

2条答案

相关问题

热门标签

最新问答