javascript警报拒绝在表单验证中工作？
我一直在努力让这些警报正确弹出。我开始使用嵌套函数，然后扔掉它们并将其全部放在一个函数中，现在当我在填写任何一个文本框后按enter键时，它什么也不做，只是将字符串放在url中，而不是像以前那样发出警报。我不确定这是我的函数调用还是其他什么，因为我仔细检查了所有的东西，所有的东西似乎都被我检查出来了。以下是不起任何作用的完整代码：javascript警报拒绝在表单验证中工作？,javascript,forms,validation,Javascript,Forms,Validation,我一直在努力让这些警报正确弹出。我开始使用嵌套函数，然后扔掉它们并将其全部放在一个函数中，现在当我在填写任何一个文本框后按enter键时，它什么也不做，只是将字符串放在url中，而不是像以前那样发出警报。我不确定这是我的函数调用还是其他什么，因为我仔细检查了所有的东西，所有的东西似乎都被我检查出来了。以下是不起任何作用的完整代码： <html xmlns="http://www.w3.org/1999/xhtml"> <HEAD> <TITLE>Smart
<html xmlns="http://www.w3.org/1999/xhtml">
<HEAD>
<TITLE>Smart Form </TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- VARIABLE DECLARATION -->
f1.city.focus();
function check_form()
{
at_sign = email.search(/@/);
if(document.f1.city.value.length < 1)
{
alert('Please enter a city');
f1.city.focus();
}
else if(document.f1.state.value.length != 2 || !(state.charCodeAt('0')>=65 && state.charCodeAt('0')<=91))
{
alert('Please enter a state in abreviated form');
f1.state.focus();
}
else if(document.f1.zip.value.length != 5 || document.f1.zip.value.isNaN()==true)
{
alert('Please enter a 5 digit zip code');
f1.zip.focus();
}
else if((at_sign<1) || (email.length<3))
{
alert('Please enter a valid email address');
f1.email.focus();
}
else
{
document.write("Form completed");
}
}
</SCRIPT>
</HEAD>
<BODY >
<form name = "f1" action="smartform.html">
<b>City</b>
<input type = "text" name = "city" size = "18" value="" onSubmit = "javascript:check_form()">
<b>State</b>
<input type = "text" name = "state" size = "4" value="" onSubmit = "javascript:check_form()">
<b>Zip Code</b>
<input type = "text" name = "zip" size = "5" value="" onSubmit = "javascript:check_form()">
<b>Email</b>
<input type = "text" name = "email" size = "18" value="" onSubmit = "javascript:check_form()">
<input type = "submit" name = "button" value = "Done" onclick = "javascript:check_form()">
</form>
</BODY>
</HTML>
智能表格
f1.city.focus（）；
函数检查表（）
{
at_sign=email.search（/@/）；
如果（document.f1.city.value.length<1）
{
警报（“请输入城市”）；
f1.city.focus（）；
}
否则，如果（document.f1.state.value.length！=2 | |！（state.charCodeAt（'0'）>=65&&state.charCodeAt（'0'）），则应将提交侦听器放在表单上，并传递对表单的引用，并返回函数返回的任何值，例如
<form onsubmit="return check_form(this);" ...>
f1尚未定义或初始化（请参见上面关于元素名称和全局变量的注释）
f1.email是一个输入元素，它没有搜索属性，您不能调用它。它确实有一个字符串值属性，您的意思可能是：
var at_sign = f1.email.value.search(/@/);
其次是：
else if(f1.state.value.length != 2 || !(f1.state.charCodeAt('0')>=65 && state.charCodeAt('0')<=91))
else if((f1.zip.value.length != 5) || (f1.zip.value.isNaN() == true))
isNaN是一个全局变量，不是字符串方法。如果未输入任何值，则该值为空字符串，isNaN（“”）
返回false。如果要测试是否输入了5位数字，请使用：
else if (!/^\d{5}$/test(f1.zip.value))
无需针对true进行测试，只需使用它，也无需对简单表达式进行分组：
else if (f1.zip.value.length != 5 || isNaN(f1.zip.value))
最后，如果所有测试均通过：
return false;
这将阻止表单提交。您可以省略此返回语句，返回undefined将允许表单提交。如果您确实需要，则返回true。onSubmit在表单中，而不是在输入中，不使用javascript:Solved=p
<form onsubmit="return check_form();" ...
好的，我想回答你的问题，但首先让我们来看看你的问题
编码并清理它。
将其用作格式正确的代码模板：
<!DOCTYPE html>
<html>
<head>
<title>Smart Form</title>
</head>
<body>
<!-- Code goes here -->
<script type="text/javascript">
</script>
</body>
</html>
Html注释如下所示：
/** Comment. */
<!-- Comment. -->
<!DOCTYPE html>
<html>
<head>
<title>Smart form</title>
</head>
<body>
<form id='smartForm' action='smartform.html'>
<b>City</b>
<input type="text" id="city" size="18">
<b>State</b>
<input type="text" id="state" size="4">
<b>Zip Code</b>
<input type="text" id="zip" size="5">
<b>Email</b>
<input type="text" id="email" size="18">
<input type="submit" value="done">
</form>
<script type="text/javascript">
var validateForm = function(evt) {
var error = false;
var cityElement = document.getElementById('city');
var stateElement = document.getElementById('state');
var zipElement = document.getElementById('zip');
var emailElement = document.getElementById('email');
if (cityElement.value.length != 2 ||
!(state.charCodeAt(0) >= 65 && state.charCodeAt(0) <= 91)) {
error = true;
alert('oops');
cityElement.focus();
}
// etc..
if (error) {
evt.preventDefault();
}
};
var smartForm = document.getElementById('smartForm');
smartForm.addEventListener('submit', validateForm);
</script>
</body>
</html>
下一步，我将教你如何快速钓鱼，这样你就可以弄清楚为什么这会被打破，以及将来如何修复这些漏洞。打开开发者控制台。常青浏览器（Chrome、Firefox等）今天要有好的。你应该知道的诀窍是如何评估你的代码，以便你可以看到你在访问数据时是否做错了什么。因此，请查看如何在浏览器中为你的平台打开开发者控制台，并在控制台中键入以下内容：
1+1
应评估为：2。
下一种类型：文档
如果您单击周围，您可以看到您可以稍微遍历dom。
下一步，使用我的上述更改加载smartForm应用程序并键入：
document.getElementById('smartForm')
您应该看到您的元素。这是如何在dom中正确查询对象。
您会注意到，如果键入document.smartForm不起作用。您应该得到null，这应该告诉您应该有一种方法可以从文档中获取元素。提示，它是getElementById。因此，如果您在所有输入中输入id，那么您可以列出所有可以查询的文档对象：
var cityElement = document.getElementById('city');
var stateElement = document.getElementById('state');
var zipElement = document.getElementById('zip');
var emailElement = document.getElementById('email');
接下来，您可以开始查询这些值，就像您刚才所做的那样：
cityElement.value.length != 2
清理后的版本如下所示：
/** Comment. */
<!-- Comment. -->
<!DOCTYPE html>
<html>
<head>
<title>Smart form</title>
</head>
<body>
<form id='smartForm' action='smartform.html'>
<b>City</b>
<input type="text" id="city" size="18">
<b>State</b>
<input type="text" id="state" size="4">
<b>Zip Code</b>
<input type="text" id="zip" size="5">
<b>Email</b>
<input type="text" id="email" size="18">
<input type="submit" value="done">
</form>
<script type="text/javascript">
var validateForm = function(evt) {
var error = false;
var cityElement = document.getElementById('city');
var stateElement = document.getElementById('state');
var zipElement = document.getElementById('zip');
var emailElement = document.getElementById('email');
if (cityElement.value.length != 2 ||
!(state.charCodeAt(0) >= 65 && state.charCodeAt(0) <= 91)) {
error = true;
alert('oops');
cityElement.focus();
}
// etc..
if (error) {
evt.preventDefault();
}
};
var smartForm = document.getElementById('smartForm');
smartForm.addEventListener('submit', validateForm);
</script>
</body>
</html>
智能表格
城市
陈述
邮政编码
电子邮件
var validateForm=函数（evt）{
var错误=错误；
var citylement=document.getElementById（'city'）；
var statelement=document.getElementById（'state'）；
var zipElement=document.getElementById（'zip'）；
var emailElement=document.getElementById（'email'）；
如果（cityElement.value.length！=2||
！（脚本元素中的state.charCodeAt（0）>=65&&state.charCodeAt（0）
被视为无效的javascript。此外，脚本元素的语言属性在HTML 4中被弃用，并在HTML5中被删除。好吧。但我仍然尝试删除它，但没有任何更改：（将onsubmit侦听器移动到表单，将其从所有控件中删除。不要在任何地方使用javascript:
。如果验证失败，让函数返回false。让侦听器返回函数返回的任何内容，例如
。您是否声明了email
？我将一个document.f1.放在我收到电子邮件的所有部分前面..仍然n你说的每一句话我都试过了，但什么都没用！！啊，我甚至会把我的新代码升级我用你更新的建议更新了我的代码，并且它起作用了：D我现在唯一需要做的就是把这些值保存在文本框中，而不是再次将它们刷新为空值。如果成功，我只是在所有if语句的a部分中返回了falsend将onsubmit值更改为返回check_form（）现在一切都很完美！！！！！！！！！！！！！谢谢你！我尝试了这个例子，并为其他元素添加了else if's，同时对其进行了适当的编辑，使其像第一个if语句一样跟随，并且在第一次运行后不会发出警报…我还想知道到底是什么原因使我的原始代码无法工作，因为我编写时遵循了课程大纲：（确定首先在修改后的代码中，您将看到f1未定义（f1.email.focus）（打开控制台）。接下来，如果在控制台打开的情况下插入此行“debugger”，然后单击“提交”，您将插入调试模式（打开控制台窗口）。在这里，您可以在控制台中键入变量并查看其值。f1确实是表单元素，但f1.email未定义。您需要获取元素w/element.getElementById（f1.getElementById或document.getElementById）.当我快速对错误进行屏幕覆盖时，我明白了你对getElement所说的话，但是我如何才能让控制台在错误消失之前暂停错误？谢谢你发布你的版本，它确实在你的codepen网站上工作。我会
var smartForm = document.getElementById('smartForm');
smartForm.addEventListener('submit', validateForm);
1+1
document.getElementById('smartForm')
var cityElement = document.getElementById('city');
var stateElement = document.getElementById('state');
var zipElement = document.getElementById('zip');
var emailElement = document.getElementById('email');
cityElement.value.length != 2
<!DOCTYPE html>
<html>
<head>
<title>Smart form</title>
</head>
<body>
<form id='smartForm' action='smartform.html'>
<b>City</b>
<input type="text" id="city" size="18">
<b>State</b>
<input type="text" id="state" size="4">
<b>Zip Code</b>
<input type="text" id="zip" size="5">
<b>Email</b>
<input type="text" id="email" size="18">
<input type="submit" value="done">
</form>
<script type="text/javascript">
var validateForm = function(evt) {
var error = false;
var cityElement = document.getElementById('city');
var stateElement = document.getElementById('state');
var zipElement = document.getElementById('zip');
var emailElement = document.getElementById('email');
if (cityElement.value.length != 2 ||
!(state.charCodeAt(0) >= 65 && state.charCodeAt(0) <= 91)) {
error = true;
alert('oops');
cityElement.focus();
}
// etc..
if (error) {
evt.preventDefault();
}
};
var smartForm = document.getElementById('smartForm');
smartForm.addEventListener('submit', validateForm);
</script>
</body>
</html>