基本上,我尝试在我的网站上添加一个表单,当点击确认/提交按钮时,程序会检查姓名和名称。电子邮件表格必须提供正确的信息,否则会显示警告。
<script language="javascript" type="text/javascript">
function validateForm()
{
var x=document.forms["form1"]["name"].value;
if (x==null || x=="")
{
alert("Please enter your name");
return false;
}
}
function validateForm()
{
var x=document.forms["form1"]["e-mail"].value;
var atpos=x.indexOf("@");
var dotpos=x.lastIndexOf(".");
if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
{
alert("Please enter your e-mail address");
return false;
}
}
</script>
</head>
<body>
<h2>Form</h2>
<p>Note: Please fill in the following fields below, thank you.</p>
<form id="form1" name="form1" method="post" action="post">
<p>
<label for="name">Name:</label>
<br />
<input type="text" name="name" id="name" />
</p>
<p>
<label for="e-mail">E-mail:</label>
<br />
<input type="text" name="e-mail" id="e-mail" />
</p>
<p>
<label for="msg">Message:</label>
</p>
<p>
<textarea name="msg" id="msg" cols="45" rows="5"></textarea>
</p>
<p>
<input type="button" name="Confirm" id="Confirm" value="Submit" />
</p>
<!-- end .content -->
</form>
</div>
<div class="sidebar2">
<h4> </h4>
<p> </p>
<p><!-- end .sidebar2 --></p>
</div>
<div class="footer"> <img src="pics/copyright.gif" width="960" height="100" alt="footer" /></div>
<!-- end .container --></div>
</body>
</html>
答案 0 :(得分:0)
只是缩进你的代码,它应该没问题,我很乐意提供帮助,但是如果没有看到代码,我就无能为力。也许链接到您网站上的页面?
答案 1 :(得分:0)
在您的代码中:
> <script language="javascript" type="text/javascript">
语言属性已被弃用大约15年,不再需要type属性,因此:
<script>
> function validateForm () {
> var x=document.forms["form1"]["name"].value;
从侦听器传递对表单的引用非常方便,因此函数可以更通用。此外,命名表单控件作为表单的命名属性添加。如果控件的名称与表单属性相同,则它将覆盖表单属性,因此您无法将其作为属性进行访问。最好避免元素名称和ID的标准属性名称,所以:
function validateForm(form) {
var x = form.userName.value
然后:
> if (x == null || x == "") {
表单控件的值是一个字符串,因此x == null
永远不会成立。只测试就足够了(也更合适):</ p>
if (x == "") {
[...]
> function validateForm() {
如果您声明具有相同名称的多个函数,则每个函数都将覆盖前一个函数,因此您只剩下最后一个函数。您应该有一个验证函数来执行检查,但每个检查可能是一个单独的函数。
> var x=document.forms["form1"]["e-mail"].value;
> var atpos=x.indexOf("@");
> var dotpos=x.lastIndexOf(".");
> if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
> {
> alert("Please enter your e-mail address");
> return false;
> }
> }
您可以使用正则表达式检查电子邮件地址的格式。
> <form id="form1" name="form1" method="post" action="post">
表单上通常不需要ID和名称属性,通常只使用ID。对于其他表单控件,需要一个名称才能成功,很少需要他们拥有ID。
可以从表单的提交事件中调用验证函数,所以:
<form id="form1" onsubmit="validateForm(this);" ...>
[...]
> <input type="text" name="name" id="name" />
不要在HTML文档中使用XML标记。并且不要使用与表单属性名称相同的元素名称,因为它们会使相关的表单属性不可访问。
</p>
<p>
<label for="e-mail">E-mail:</label>
<br />
信息:
如果这是提交按钮,则将其设置为提交。如果不提交值,则不需要名称或ID:
<input type="submit" value="Submit">
所以你的表格和代码可以是:
function validateForm(form) {
var reUserName = /\w+/; // User name has some letters
var reEmail = /.+@..+\..+/; // email has some characters, @, then a dot near the end
var passed;
if (!reUserName.test(form.userName.value)) {
passed = false;
// show message for user name
}
if (!reEmail.test(form.eMail.value)) {
passed = false;
// show message for email
}
return passed;
}
请注意,电子邮件验证就是您所拥有的,这不是特别彻底。
然后是表格:
<form onsubmit="return validateForm(this);">
Name: <input name="userName"><br>
E-mail: <input name="eMail"><br>
<input type="submit">
</form>