[英]Why does this js IF condition never evaluate to true?
I'm working on a simple validation script to be sure the user has entered something that at least looks like a valid email address. 我正在研究一个简单的验证脚本,以确保用户输入的内容至少看起来像一个有效的电子邮件地址。 This is a simplified version and can be tested on jsbin here . 这是一个简化版本,可以在jsbin测试在这里 。
HTML: HTML:
<form name="emailForm" action="whatever.php" method="post">
<input name="email" id="email" type="text" onkeyup="checkEmail()" />
<input type="submit" name="submit" id="submit" value="submit" disabled />
</form>
<div id="errorMsg">
A valid email address is required.
</div>
JS JS
function checkEmail() {
var email = document.getElementById("email").value;
var valid = false;
if (email.length > 5 && email.search("@") > 0 && email.search(".") > 0) {
valid = true;
document.getElementById("errorMsg").innerHTML = "";
}
document.getElementById("submit").disabled = valid == false;
}
My expectation is that any string that is more than 5 chars long and contains an @ and a . 我的期望是任何长度超过5个字符串且包含@和a的字符串。 that are not in the first position should evaluate to true, but it never does no matter what is entered in the input. 不在第一个位置的应该评估为true,但无论输入输入什么,它都不会。 What am I missing here? 我在这里错过了什么? I'm sure it's something foolish. 我确定这是愚蠢的。
I have confirmed that the function is getting called and always returning valid=false by using an alert(valid) to troubleshoot. 我已经确认该函数被调用并且总是通过使用警报(有效)进行故障排除来返回valid = false。
You are setting #submit
and valid
to false no matter what valid
value is. 无论valid
是什么,您都将#submit
和valid
设置为false。
document.getElementById("submit").disabled = valid = false;
should be 应该
document.getElementById("submit").disabled = !valid;
Also, you should be using indexOf
instead of search, and 0 is a completely valid index for both indexOf
and search
(you should be doing >=
instead of >
) 此外,您应该使用indexOf
而不是search,而0是indexOf
和search
的完全有效的索引(您应该做>=
而不是>
)
One of your issues is with this part of the test: 您的一个问题是这部分测试:
&& email.search(".") > 0
As others have pointed out, in the search method , the "." 正如其他人所指出的,在搜索方法中 ,“。” is used for a regular expression, so is equivalent to /./
, which matches any character, not a period. 用于正则表达式,因此等同于/./
,它匹配任何字符,而不是句点。 The test always returns false as the first character is at 0. Use "\\\\."
当第一个字符为0时,测试总是返回false "\\\\."
使用"\\\\."
to match a period, it's used to create a regular expression equivalent to /\\./
. 为了匹配一个句点,它用于创建一个等同于/\\./
的正则表达式。
There are other issues: 还有其他问题:
Most of these are fixed in the sample below. 其中大部分已在下面的示例中修复。 It uses the same listener for both the form and the input, so uses a bit of logic to get the value based on which listener was called. 它对表单和输入使用相同的侦听器,因此使用一些逻辑来根据调用的侦听器获取值。
function checkEmail(el) { var form = el.form || el; var email = form.email.value; var valid = false; if (email.length > 5 && email.search("@") > 0 && email.search("\\\\.") > 0) { valid = true; } document.getElementById("errorMsg").innerHTML = valid? "" : 'A valid email address is required.'; document.getElementById("submitButton").disabled = !valid; return valid; }
<form onsubmit="return checkEmail(this)"> <input name="email" onkeyup="checkEmail(this)"> <input type="submit" id="submitButton" disabled> </form> <div id="errorMsg"> A valid email address is required. </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.