Question

大家好我正在研究这个

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Form</title>
<script type="text/javascript">
</script>
</head>
<body>
<h2>**Form**</h2>
<form  name=form method="post" action="javascript" subject=RSVP" enctype="text/plain" >
<input type=text name="first" size="20"> First Name<BR>
<input type=text name="last" size="20"> Last Name<BR>
<input type="text" name="email" size="20"> E-Mail<BR><BR>
<input type="submit" value="Submit">
<input type="reset" value="Clear Form"><br>
</form>
 </body>
 </html>

我在这里真的很困惑..我需要一个onsubmit表单处理程序和一个创建验证脚本。好的，如果我是对的，验证脚本是需要正确放置的功能吗？对不起，我知道你们中的一些人可能认为这很容易，但我还在学习。现在我在我的书中有例子，但他们一次只有一个。有没有办法可以提交所有提交或者一次只能提交一个？感谢

好的，我正在研究这个......

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   <head>
   <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Form</title>
   <script type="text/javascript">
    <!--
   function validate_form()
    {
valid = true;

    if ( document.contact_form.contact_first.value == "" )
    {
            alert ( "Please fill in the 'Your Name' box." );
            valid = false;
     }

    return valid;
     }

 //-->

 </script>
 </head>
  <body>
 <h2>**Form**</h2>
 <form  name="contact_form"  method="post" action="javascript" onSubmit="return  validate_form();"> 
 <input type=text name="contact_first" size="20"> First Name<BR>
 <input type=text name="contact_last" size="20"> Last Name<BR>
 <input type="text" name="contact_email" size="20"> E-Mail<BR><BR>
 <input type="submit" value="Submit">
 <input type="reset" value="Clear Form"><br>
 </form>



 </body>

</html>

现在我可以复制其他两个的功能，或者如何为电子邮件执行该功能？

Answer 1

我在这里添加了一个如何操作的示例：

http://jsfiddle.net/tomgrohl/JMkAP/

我在表单中添加了一个onsubmit处理程序：

<form method="post" action="javascript" enctype="text/plain" onsubmit="return valForm(this);">

并在页面顶部添加了一个简单的验证功能：

<script type="text/javascript">
function valForm( form ){

    var firstVal, lastVal, emailVal, error = '';

    firstVal= form.first.value;  
    lastVal= form.last.value;
    emailVal= form.email.value;

    //OR
    //firstVal= document.getElementById('first').value;  
    //lastVal= document.getElementById('last').value;
    //emailVal= document.getElementById('email').value;

    if( firstVal.length == 0){
        error += 'First name is required\n';
    }

    if( lastVal.length == 0){
        error += 'Last name is required\n';
    }

    if( emailVal.length == 0){
        error += 'Email is required\n';
    }

    if( error ){
        alert( error );
        return false;
    }

    return true;
}
</script>

Answer 2

为表单调用一次OnSubmit。

在一次调用该函数期间，您可以在一个onSubmit函数中验证所有表单字段。

function myOnSubmitHandler(theForm) { 
    if (theForm.data1.value == "") { 
        alert("This field is empty.");
        return false; // suppress form submission
    } else {
        return true; // A-OK, form will be submitted
    }
}

HTML中的

：

<form method="POST" ACTION="SomethingOnServer.php" 
      onSubmit="return myOnSubmitHandler(this);">

Answer 3

我需要一个onsubmit表单处理程序

你是这么说的; <form onsubmit="return myValidate(this);" .... >

myValidate是你的验证函数，它返回true | false，表示你是否希望将表单提交给它的处理程序脚本（你也缺少它）。

Answer 4

我建议您使用jQuery和jQuery validate验证您的表单无需重新发明轮子

请务必查看validator's demo

给我看一个简单的javascript onSubmit处理程序

4 个答案: