Question

请不要jquery解决方案

大家好。我搜索了所有的论坛，但找不到我要找的答案，因为我发现了类似的问题，但它们似乎都是通过jquery解决的。我不想为此使用jquery。

我正在尝试为我的网站使用的表单创建不需要的隐藏字段。如何在显示信息时输入字段，但在隐藏信息时不需要输入信息？以下是我正在使用的代码，它似乎在互联网上很常见：

我也在WordPress上使用Contact Form 7来实现此代码，并构建我的表单。

<script type="text/javascript" language="JavaScript">
function HidePart(d) {document.getElementById(d).style.display = "none";}
function ShowPart(d) {document.getElementById(d).style.display = "block";}
function CheckboxChecked(b,d) {
if(b) {ShowPart(d);}
else {HidePart(d);}
}
</script>


<p><input type="checkbox" name="Form1" value="yes" onclick="CheckboxChecked(this.checked,'checkboxdiv1')">More Info</p>


<!-- Form 1 -->

<div id="checkboxdiv1" style="display:none">
<p> Username: <input type="text" name="Usrname" required></p>
<p> FirstName: <input type="text" name="FirstName" required></p>
<p> LastName: <input type="text" name="LastName" required></p>
<p> MothersName: <input type="text" name="MothersName" required></p>
<p> FathersName: <input type="text" name="FathersName" required></p>
<p> SiblingsName: <input type="text" name="SiblingsName" required></p>
</div>


<!-- Form 2 -->

<p><input type="checkbox" name="Form2" value="yes" onclick="CheckboxChecked(this.checked,'checkboxdiv2')">More Info</p>


<div id="checkboxdiv2" style="display:none">
<p> Username2: <input type="text" name="usrname2" required></p>
<p> FirstName2: <input type="text" name="FirstName2" required></p>
<p> LastName2: <input type="text" name="LastName2" required></p>
<p> MothersName2: <input type="text" name="MothersName2" required></p>
<p> FathersName2: <input type="text" name="FathersName2" required></p>
<p> SiblingsName2: <input type="text" name="SiblingsName2" required></p>
</div>

Answer 1

尝试这样的事情：

function HidePart(d) {
   var x =document.getElementById(d);
   x.style.display = "none";
   x.setAttribute ("required", "false");
}

当然，显示一个部分时反向。

Answer 2

为什么不添加required =＆＃34; true＆＃34;通过javascript on show并删除隐藏？

不需要隐藏字段

2 个答案: