首页 > 解决方案 > 如何制作提交数据的拨动开关

问题描述

再会!我正在编写一个代码,应该允许我使用开关切换按钮来提交表单。

例如,默认值为“light”,当用户单击切换按钮时,它会提交一个 value="dark"。

我无法实现提交切换。当我单击它时,它什么也不做,只是切换。

我的 HTML 切换表单是

<form method="post">
  <label class="switch">
    <input type="checkbox" name="checkbox" value="dark">       <span class="slider round"></span>
  </label>
</form>

提前致谢!

标签: javascripthtml

解决方案


您可以使用 jQuery 甚至 vanilla javascript 在单击或选中复选框时触发表单提交事件。

示例 HTML

<form method="post" id="myForm">
  <label class="switch">
    <input type="checkbox" name="checkbox" value="dark" id="myCheckBox">       <span class="slider round"></span>
  </label>
</form>

相关的jQuery代码

$("#myCheckBox").change(function() {
  if(this.checked === true) {
     $("#myForm").submit();
  }
})

这只是示例,您可以根据您的要求进行修改

供参考jQuery 更改事件处理程序

更新 您尚未对表单定义任何操作。我修正了错字#myCheckbox=>#myCheckBox


推荐阅读