javascript - 如果值为空，则验证不起作用

Question

所以我有这段代码，我在说 if website_name==="" 显示错误但是它似乎不起作用，因为如果我输入一些东西并删除它所以它是空的它仍然显示它是有效的，所以它运行 else 语句，但是如果我输入一个数字然后我得到一个错误，但我也需要它为空值工作。

var message;
    var inputField = document.getElementById("website_name");
$( "#website_name" ).keyup(function() {
  if(website_name==="" || !/^[a-z]*$/.test(this.value))
  {
    $("#website_name").css('border', '3px solid red');
    inputField.style.backgroundColor = "#f27676";
    message = 'Only lower case characters allowed!';
    $('div.modal-body .msgPlaceholder').empty().append(message);
  }else{
    $("#website_name").css('border', '3px solid green');
    inputField.style.backgroundColor = "#56c145";
    message = 'Your name is correct';
    $('div.modal-body .msgPlaceholder').empty().append(message);
  }
});

Answer 1

您必须使用 this.value == "" 而不是 website_name == "" 因为 website_name 不是 变量

如果你想在检查前使用toLowerCase，试试这个:

var val = this.value.toLowerCase();
if (val == "")

var message;
var inputField = document.getElementById("website_name");
$("#website_name").keyup(function() {
  if (this.value == "" || !/^[a-z]*$/.test(this.value)) {
    $("#website_name").css('border', '3px solid red');
    inputField.style.backgroundColor = "#f27676";
    message = 'Only lower case characters allowed!';
    $('div.modal-body .msgPlaceholder').empty().append(message);
  } else {
    $("#website_name").css('border', '3px solid green');
    inputField.style.backgroundColor = "#56c145";
    message = 'Your name is correct';
    $('div.modal-body .msgPlaceholder').empty().append(message);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="website_name" />