javascript - 如何在复选框选中时启用 Onclick <Button> PHP

Question

我想启用我的 Button ，一旦选中该复选框， 我最近搜索了很多，但所有解决方案都针对 表单或输入标记， 我有一个按钮

<button onclick= buttonOnClick(); onmouseover="mouseOver();" onmouseout="mouseOut();" >Click here <i id="rtb" class="fa fa-moly-square rtb"></i></button>

和复选框代码:

 <div class="page__toggle">
      <label class="toggle">
        <input class="toggle__input" type="checkbox" >
        <span class="toggle__label">
          <span class="toggle__text">Check Me!</span>
        </span>
      </label>
    </div>
  </div>
</div>

Answer 1

这里的方法是向您的 HTML 元素 添加一个事件监听器，以便您可以在用户与复选框交互时使用react，然后您可以更新button 元素中 disabled 属性的状态。

const checkbox = document.getElementById('checkbox');
const button = document.getElementById('button');

const toggleButtonState = function (event) {
  button.disabled = !event.target.checked;
}

checkbox.addEventListener('change', toggleButtonState)

<button type="button" id="button" disabled>A button</button>
<label>
  <input type="checkbox" id="checkbox"/>
  <small>Toggle Button</small>
</label>