时间戳

首页 > 解决方案 > 发送带有隐藏元素的 html 表单

javascript - 发送带有隐藏元素的 html 表单

问题描述

今天我遇到了一个奇怪的行为。我使用 Bootstrap 制作了一个 html 表单供用户订阅。您可以一次订阅多个用户，但要查看第二个和第三个用户的输入字段，您必须先切换选择按钮 ( https://prnt.sc/t96lxt )。问题是我不能只为 1 或 2 个用户发送表单，因为隐藏部分的某些字段设置为必填项。

所以，我的问题是，如何发送包含必填字段的隐藏部分的表单？

我的表格可以在http://debosvrienden.alfapre.be/nl/inschrijving找到

标签： javascriptjqueryforms

解决方案

也许您可以使用 javascript 尝试这样的事情

const checkBox = document.querySelector("YOUR_CHECKBOX");

checkBox.addEventListener("change", (e) => {
  if (e.target.checked) {
    document.querySelector(".hidden-input-field-1").setAttribute("required", true);
    document.querySelector(".hidden-input-field-2").setAttribute("required", true);
  } else {
    document.querySelector(".hidden-input-field-1").setAttribute("required", false);
    document.querySelector(".hidden-input-field-2").setAttribute("required", false);
  }
});

显然，您必须使用自己的选择器。在这里，您只是获得对复选框的引用，一旦更改，您将更改输入的所需属性。

推荐阅读