Javascript 名称验证
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16839024/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Javascript name validation
提问by AJJ
I have a javascript function written to validate a field on my form. This function is supposed to make sure the field is not empty, does not exceed the limit of 35 characters and only contains alphabetic characters and a hyphen(-). I had code to make sure the field is not empty and that it does not exceed 35 characters which worked fine but i added code to validate the field to the usable characters and i tested it out by leaving the field empty to make sure that still worked but when i hit the submit button the function didn't seem to validate at all, didn't give me an alert and just submitted. Here is my code:
我编写了一个 javascript 函数来验证表单上的字段。此函数应该确保该字段不为空，不超过 35 个字符的限制，并且只包含字母字符和连字符 (-)。我有代码来确保该字段不为空并且它不超过 35 个字符，这可以正常工作，但我添加了代码来验证该字段的可用字符，并通过将该字段留空来测试它以确保仍然有效但是当我点击提交按钮时，该功能似乎根本没有验证，没有给我一个警报，只是提交了。这是我的代码：
function validateFamily()
{
var family=document.getElementById('family');
var stringf = document.getElementById('family').value;
if (family.value=="")
{
alert("Family name must be filled out");
return false;
}
else if (document.getElementById('family').value.length > 35)
{
alert("Family name cannot be more than 35 characters");
return false;
}
else if (/[^a-zA-Z\-\]/.test( stringf ))
{
alert("Family name can only contain alphanumeric characters and hypehns(-)")
return false;
}
return true;
}
<form name="eoiform" method="POST" action="<?php echo $_SERVER["PHP_SELF"];?>" id="eoi" onsubmit="return validateFamily() && validateGiven() && validateMaleFemale() && validDate() && validateAddress() && validatePost() && validateParent() && validateWork() && validateHome() && validateMob() && validateCheckBoxes();">
<b>Student's Family Name</b>
<br>
<input type="text" id="family" name="family" /><?php echo $strmsgf; ?>
<input type="submit" name="submit" id="submit" value="submit" />
</form>
Could anyone show me how to fix my code?
谁能告诉我如何修复我的代码？
回答by 15ee8f99-57ff-4f92-890c-b56153
Your regular expression is broken. You've escaped the closing square bracket around the character set. Try this:
你的正则表达式坏了。您已经转义了字符集周围的结束方括号。试试这个：
else if (/[^a-zA-Z0-9\-]/.test( stringf ))
Also, there's a lot of weird clutter in there that's annoying but not fatal: How many times do you really need to call getElementById('family') in that method? Once.
此外，那里有很多令人讨厌但并不致命的奇怪混乱：您真的需要在该方法中调用 getElementById('family') 多少次？一次。
if (stringf=="")
{
alert("Family name must be filled out");
return false;
}
else if (stringf.length > 35)
{
alert("Family name cannot be more than 35 characters");
return false;
}
else if (/[^a-zA-Z0-9\-]/.test( stringf ))
{
alert("Family name can only contain alphanumeric characters and hypehns(-)")
return false;
}
return true;
回答by konnection
UPDATED:
更新：
Sorry, the problem is with your regex, i missed that, change to this its fully working:
抱歉，问题出在您的正则表达式上，我错过了，更改为它可以正常工作：
var ck_password = /^[A-Za-z0-9-]/;
if(!ck_password.test(stringf))
{
alert("Family name can only contain alphanumeric characters and hypehns(-)")
}
Console in chrome, go to the OPTIONS in the right top coner, select TOOLS, then DEVELOPER TOOLS.
chrome 控制台，转到右上角的选项，选择工具，然后选择开发工具。
回答by Aliaksei Shytkin
Try to rename submit button, rid of id and name "submit" (rename to "doSubmit" or smth), it can cause problems and conflict with event "submit" of form.
尝试重命名提交按钮，去掉 id 和名称“提交”（重命名为“doSubmit”或 smth），它可能会导致问题并与表单的“提交”事件发生冲突。
