Question

HTML：

<div id="member_form" style="display:none">
    <form id="contactform"  method="post" action="." onsubmit="if($('input[name=name]').is(':checked')){return true;}else{$('#choose_warning').show();return false}">
        {% csrf_token %}
        <h2> Choose Person</h2>
        <br />
        {% if contact_list %}
        {%for contact in contact_list%}
        <input type="radio" name="name" id="contact" value="{{contact.first_name}} {{contact.last_name}}" maxlength="30" />
        {{contact.first_name|title}} {{contact.last_name}}<br />
        {% endfor %}
         <input type="hidden" name="action_type" value="" id="member_action_type" maxlength="30" />
        <p style="display:none;color:red" id="choose_warning">Please choose a contact.</p>
        <div style="width:180px;margin:20px 5px 0 10px" align="left">
            <button style="margin-right:10px;" type="button" class="close" name="cancel" class="forward backicon">
                <img src="{{ STATIC_URL }}images/button-icon-ir-back.png" width="12" height="17" alt="" />
            Cancel</button>  {% include "buttons/add.html" %}
        </div></form>

JS：

$(document).ready(function(){
         $(".add_list").click(function(){
             '''''''
         $("#member_form").fadeIn(1000);
       });
      $(".close").click(function(){
         $("#member_form").fadeOut(500);
        });
    });

我的问题是，如果我选择一个单选按钮并按取消，如果我打开弹出而没有刷新，所选的单选按钮处于检查模式，我希望它清除，如果我单击取消按钮并打开弹出窗口，怎么办呢。

Answer 1

现在它清除所有无线电：

$(".close").click(function(){
     $("input:radio").prop("checked", false);
     $("#member_form").fadeOut(500);
});

Answer 2

只需使用此代码进行查询，根据您的用途编辑按钮名称。它可以正常工作。

<!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>jQuery Check/Uncheck Radio Button</title>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function(){
        $(".check-male").click(function(){
            $("#male").prop("checked", true);
        });
        $(".check-female").click(function(){
            $("#female").prop("checked", true);
        });
          $(".cancel").click(function(){
            $("#female").prop("checked", false);
              $("#male").prop("checked", false);
        });
    });
    </script>
    </head>
    <body>
        <label><input type="radio" name="gender" id="male"> Male</label>
        <label><input type="radio" name="gender" id="female"> Female</label>

         <button type="button" class="cancel">Cancel</button>
        <p><strong>Note:</strong> Click the cancel uncheck radio button.</p>  
    </body>
    </html>

单击取消按钮后清除选中的复选框

2 个答案: