Question

我目前有一个带有一些单选按钮的模态（“ .modal-options”）和一个关闭的模态按钮。我试图做到这一点，因此当单击关闭按钮时，所有单击的单选按钮都变为未选中状态。当前代码如下。控制台说removeAttr不是函数...？谢谢

includeBuild '../path/to/subproject/'

 <p class='information'> Cancel Appointment? </p>
        <div class="modal-flex">
          <%= f.radio_button :delete_appointment, :true %>
          <%= f.label :delete_appointment_true, "Yes", class: "modal-options cancel" %>
     
          <%= f.radio_button :delete_appointment, :false %>
          <%= f.label :delete_appointment_false, "No", class: "modal-options cancel" %>
          
        </div>

  <p class="close"> <%= t(".close")  %> </p>

Answer 1

首先，removeAttr不是HTML元素上的函数；您的意思是removeAttribute（mdn）。

第二，要取消选中输入，您需要使用input.checked = false。 removeAttribute不起作用的原因是，如果您检查输入元素，则在切换时将看到没有添加或删除“ checked”属性。 “已检查”是属性，不是属性；在这种情况下以及进入自定义元素时，区别很重要。

  document.querySelector('button').addEventListener('click', () => {
    document.querySelector('input').checked = false;
  });

<input type="checkbox">
<button>uncheck</button>

Answer 2

Docker for Mac getting started guide是jQuery方法。等效的JavaScript方法是.removeAttr()

不过，我更喜欢使用 checked 属性：

button.checked = false;

您要定位标签，而应该定位 radio 按钮：

var buttons = document.querySelectorAll(".modal-flex input[type=radio]");

单击关闭按钮时，取消选中单选按钮

2 个答案: