Question

我希望能够做的就是每次用户在输入字段中输入新字符时验证电子邮件。当输入字段为空时，它不应显示任何内容，但当它包含字母时，它应显示无效字符的位置。

我的代码有效但输入字段为空时不显示任何内容，因为它使用嵌套的“else”而不是它应该使用的那个。有人帮忙吗？提前致谢。 andyy

var tick = "<img src='images/tick.png' width='20' height='20'/>";
var cross = "<img src='images/cross.png' width='20' height='20'/>";
var email_element = document.contact_form.email_field.value;
function validate_email(id) {
     if ( email_element != '' ) {
        var letters = /^[A-Za-z]+$/;
        if ( document.contact_form.email_field.value.match(letters) )
        {
            document.getElementById(id).innerHTML = tick;
                valid = true;
        } else {
            document.getElementById(id).innerHTML = cross;
            valid = false;
        }
    } else {
        document.getElementById(id).innerHTML = '';
    }
    return valid;
}

Answer 1

问题很可能是这一行：

var email_element = document.contact_form.email_field.value;

您正在分配一个等于电子邮件字段值的全局变量，然后再也不会更新该变量。这不会创建到字段当前值的“活动”链接，它只是存储执行该行时的值。这反过来意味着您的函数if中的第一个if ( email_element != '' )语句正在评估电子邮件字段的非当前值。

将该行移动到 in 函数中，然后每次运行该函数时，您将获得该字段的最新（当前）值。

编辑：此外，您没有在非嵌套的else中为valid分配值。您应该将valid声明为函数中的局部变量，并确保在每个if和else分支中正确设置它（或者在声明它时将其默认为false）。作为thomasrutter 表示你目前没有在你的函数中使用valid语句声明var，这意味着它将被创建为一个全局变量，这反过来意味着当你没有给它一个值时非嵌套的else你的函数将返回前一次调用中已有的任何值valid。（实际上，根据您发布的代码，您根本不需要valid变量：您可以直接在if的每个分支中说return true;或return false; / else结构。）

Answer 2

尝试将email_element != ''替换为document.contact_form.email_field.value != ''因为我怀疑email_element是对元素的引用，并且永远不会等于''。更好的是，创建一个局部变量email_value并为其赋值document.contact_form.email_field.value并在两个地方使用它，如，

function validate_email(id) {
  var email_value = document.contact_form.email_field.value;
  if ( email_value != '' ) {         
    var letters = /^[A-Za-z]+$/;
    if ( email_value.match(letters) ) {
       document.getElementById(id).innerHTML = tick;
       valid = true;
    }
    else {
      document.getElementById(id).innerHTML = cross;
      valid = false;
   }
  } 
  else {
    document.getElementById(id).innerHTML = '';
  }
  return valid; 
}

Answer 3

设置email_element时，您将通过复制获取一次值，因为它是一个字符串。因此，如果页面加载该字段为空，则email_element现在设置为''并保持设置为它，直到您再次设置它为止。

标签是通过引用设置的，所以你可能想要的是：

var email_element = document.contact_form.email_field;
. . .
if(email_element.value != '')

为什么我的嵌套if和else语句不起作用？

3 个答案: