Question

我正在尝试创建一个简单的HTML表单＆amp;我想用javascript来验证这些值这是表格形式：

<form action="" onSubmit="return formValidation();" method="Post" name="form">

以下是HTML表单的一部分：

<label for="text">my text:</label>
<input type="text" name="text">
<div id="error"></div>
<input type="submit" value="submit">

＆安培;这是formValidation()函数：

function formValidation() {
   var mytext=document.form.text;
   if (textValidation(mytext, 3, 20)) {

   }
   return false;
}

＆安培;这是textValidation()代码：

function textValidation(txt, mn, mx) {
     var txtlen = txt.value.length;
     if (textlen == 0 || txtlen <=mn || txtlen > mx ) {
           document.getElementById('error').innerHTML = '<h6 style="color: red;">text is invalid</h6>';
            return false;
            }
      return true;
}

问题是当我输入无效文本时，它会显示错误但是再次点击提交按钮无效，即使我更改了文本。
我使用过alert()＆amp;它工作得很好。
我做错了什么？

Answer 1

您正在设置错误文本，但是您没有将其清除，因此它只是粘在一起。此外，您必须在formValidation函数的if语句中返回true，否则它将始终返回false。

您可以清除以下消息：

function textValidation(txt, mn, mx) {
  var txtlen = txt.value.length;
  if (textlen == 0 || txtlen <=mn || txtlen > mx ) {
    document.getElementById('error').innerHTML = '<h6 style="color: red;">text is invalid</h6>';
    return false;
  }
  document.getElementById('error').innerHTML = "";
  return true;
}

由于formValidation始终返回false，因此永远不会允许表单提交。这对于测试你的JS很好，但是后来你会想要使用这样的东西：

function formValidation() {
  var mytext=document.form.text;
  if (textValidation(mytext, 3, 20)) {
    return true;
  }
  return false;
}

Answer 2

无论条件语句的结果如何，您的函数formValidation()总是会返回false。

考虑您的代码，并在某些方面进行了更正：

function formValidation() {
   var mytext=document.form.text;
   if (textValidation(mytext, 3, 20)) {

   }
   return false;
}

如果函数textValidation(mytext, 3, 20)为false，则formValidation()返回false。如果textValidation(mytext, 3, 20)为真，那么...... if语句的主体执行，这是空的，然后formValidation返回false。

此外，代码中还存在许多不匹配的括号和其他语法相关问题。由于Javascript具有固有的灵活性，因此您可能会在实践中错过这些内容。我建议使用JSHint来验证和改进Javascript代码的一般质量和设计。

Answer 3

您可以像这样编写表单验证函数

function formValidation() {
var mytext=document.form.text;
//if the variable boolval is initialized inside double quotes it is string now it is bool variable
var boolval=false; 
if (textValidation(mytext, 3, 20)) {
boolval=true;
}
return boolval;
}

如果textvalidation为true，则它会将true初始化为boolval，否则此函数将返回boolval false，因为我们在[默认]之前初始化了

使用javascript进行简单的表单验证

3 个答案: