Question

这是我的HTML代码：

 <input id="email" placeholder="Enter your email" type="email"  required>
 <button type="submit" id="submitButton">SUBMIT</button>

js code：

var email = document.getElementById('email');
var submitButton = document.getElementById('submitButton');


submitButton.onclick = function(){
  if(email.value == "")
        alert("Please enter correct email");
        return false;
if(email.indexOf("@") < 1 || email.lastIndexOf(".") - email.indexOf("@") <2)
        alert("Please enter correct email");
        return false;
else
        return(true);

错误消息始终相同：TypeError：email.indexOf不是函数在HTMLButtonElement.submitButton.onclick

Answer 1

您需要input元素的值。 email = document.getElementById('email')将返回输入元素，但不返回值

进行此更改

var email = document.getElementById('email').value;

Answer 2

如果您想查看电子邮件。它更容易使用正则表达式这样做。请参阅下面的示例，了解如何执行此操作。

function validateEmail(email) {
  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  return re.test(email);
}

它使用了许多资源参考的基本正则表达式来检查电子邮件的类型。

function validateEmail(email) {
  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  return re.test(email);
}

function validate() {
  $("#result").text("");
  var email = $("#email").val();
  if (validateEmail(email)) {
    $("#result").text(email + " is valid :)");
    $("#result").css("color", "green");
  } else {
    $("#result").text(email + " is not valid :(");
    $("#result").css("color", "red");
  }
  return false;
}

$("#validate").bind("click", validate);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<form>
  <p>Enter an email address:</p>
  <input id='email'>
  <button type='submit' id='validate'>Validate!</button>
</form>

<h2 id='result'></h2>

javascript电子邮件验证，无法获得indexOf工作

2 个答案: