如果值为空,则验证不起作用

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不是variable

如果你想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" />