Question

我有两个问题：
如何更好地检查输入？我有想法：
首先，使字段靠近输入。

<input type='text' name='firstname'><label id='firstnameError'></label>

其次，在输入onBlur上调用js-function，输入id和此标签的id。

<input type='text' name='firstname' id='firstname' onBlur='checkEmpty("firstname", "firstnameError");'><label id='firstnameError'></label>

和js-script：

function checkEmpty(fieldId, errorFieldId)
{
    var data = document.getElementById(fieldId).value;
    if (data == "") 
    {
        document.getElementById(errorFieldId).innerHTML="Error, input something!...";
    }
}

我将在所有输入上使用此功能，对吗？这是对的吗？

如何正确检查表格中的所有输入？
当然我可以设置type = button和onSubmit调用一些函数，它将检查这个表单中的所有元素。〜与第一个问题相同的功能，但每个输入有5-7个if块。对于10种形式，我必须编写10个函数，等等。它有多好？在我看来，我只能发送表单ID /名称并获取元素的孩子。我对么？

也许另一种方式？无论如何我在我的网站上使用jquery（一些ajax）。也许在jquery上做我想要的更容易？问题是我在js中不太好，很容易使用jquery。你觉得怎么样？

Answer 1

如果您只想验证是否提供了某些数据，可以使用必需的属性。

<input type="text" name="username" required>

如果你使用XHTML，它应该如下所示..

<input type="text" name="username" required="required">

Internet Explorer 10，Firefox，Opera和Chrome支持必需属性，Internet Explorer 9及更早版本或Safari不支持。

如果您想使用JavaScript。您可以创建一个javascript函数，该函数将在提交表单时调用。

<form name="search" onsubmit="return validate()" >
   Name: <input type="text" name="name"/>
   Age: <input type="gender" name="sex"/>
   <input type="submit" name="Submit" value="Submit"/>
</form>

function validate(){
  // all the code for verification
  return false;  // if any of the step verification step fails. Otherwise return true.
}

来源：http://www.w3schools.com/tags/att_input_required.asp

Answer 2

为了改进您的设计，最好使用非内联JavaScript。尝试使用这样的设计：

var fname = document.getElementById("firstname");
var other = document.getElementById("otherid");
fname.onblur = other.onblur = function() {
   checkEmpty(this.id,this.id+"Error");
}

这将为所有您想要的元素提供相同的onclick函数，并消除那些令人讨厌的onblur属性。

编辑：确保在链接这样的分配之前声明变量，否则会产生不需要的全局变量。

如何检查<form>中的输入并正确发送表单</form>

2 个答案: