Question

我被要求使用JavaScript验证码创建一个简单的表单。我构建了整个表单，并且我的所有验证脚本都正常工作，但是我被要求在相应字段旁边的Span标签中显示任何相关错误（而不是像我以前那样显示警报）。

我被告知在每个元素旁边都有一个span标签，如文本输入，单选按钮等，并带有先前输入的相应错误文本，然后设置每个跨度的样式以便隐藏它们。按下提交按钮时，脚本应该将相应范围的样式更改为可见，以便显示文本。我已经为此编写了代码，但我遇到的问题是我的Span错误变得可见，但几乎立刻就会消失回隐藏状态。这有什么特别的原因可以发生吗？

这是我的一些代码。

HTML：

< input type="checkbox" name="agree"/> < span id="agreeSpan>Error text< /span>

CSS：

span {
color:red;
font-size:small;
visibility:hidden;
}

JavaScript：

   function validateAgreement()
    {

    var agreeBox = document.registration.agree;
    var agreeSpan = document.getElementById('agreeSpan');

   if (!agreeBox.checked) {
      agreeSpan.style.visibility = 'visible';
      return false;
    }

我错过了一些明显的东西吗？我是否有可能尝试设置1个特定范围，并且通用span标签的样式属性是否覆盖了这个特定范围？

非常感谢并且道歉，如果这是一个菜鸟问题！我是JS的新手：）

Answer 1

要停止提交，返回false是不够的。这取决于你如何调用该函数，我想这就是这样的

<form action='blah' onsubmit='return validateAgreement();'>
 ...
</form>

请注意返回。 on submit处理程序需要返回false，因此您需要确保返回函数返回的任何值。如果你刚才......

<form action='blah' onsubmit='validateAgreement();'>
 ...
</form>

然后您的表单将始终提交。

Answer 2

在您的HTML代码中，您错过了id周围的结束语它应该是id="agreeSpan"，但您输入了id="agreeSpan

跨度在提交时消失

2 个答案: