在IE9中使用Jquery和Modernizer验证HTML5表单_Jquery_Internet Explorer_Html_Validation_Modernizr

在IE9中使用Jquery和Modernizer验证HTML5表单

jquery internet-explorer html validation

在IE9中使用Jquery和Modernizer验证HTML5表单,jquery,internet-explorer,html,validation,modernizr,Jquery,Internet Explorer,Html,Validation,Modernizr,我正在创建一个HTML5表单，不幸的是占位符属性在IE9中不起作用。Modernizer帮助我解决了这个问题，但是Modernizer的问题是创建占位符属性作为输入值，这限制了我验证字段是否为空为了解决验证问题，我创建了以下代码： $(".button").click(function(){ var reEmail = /^[A-Za-z0-9][a-zA-Z0-9._-][A-Za-z0-9]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/; var

我正在创建一个HTML5表单，不幸的是占位符属性在IE9中不起作用。Modernizer帮助我解决了这个问题，但是Modernizer的问题是创建占位符属性作为输入值，这限制了我验证字段是否为空

为了解决验证问题，我创建了以下代码：

$(".button").click(function(){
  var reEmail = /^[A-Za-z0-9][a-zA-Z0-9._-][A-Za-z0-9]+@([a-zA-Z0-9.-]+\.)+[a-zA-Z0-9.-]{2,4}$/;
  var email = $("#email");
  var name = $("#name");
  if (name.val()=="Name [Required]" && name.val()==""){
     name.val("");
     name.focus();
  } else if (email.val()=="Email [Required]" && email.val()==""){
     email.val("");
     email.focus();
  } else if (!reEmail.test(email)){
      email.val("");
      email.focus();
  } else{
      alert("Thanks!");
  }
});

但即使电子邮件是正确的，这也不起作用

注意：很抱歉我的英语和JS代码，我还在学习：）

我发现您的代码有一些地方是错误的：

您正在检查val是否等于“Email[Required]和空字符串”。这是无效的，因为它们不能同时为这两个值

在电子邮件测试中，您需要根据email.val（）而不是jquery选择器进行测试

（！reEmail.test（email））

应该是

（！reEmail.test（email.val（））

我发现您的代码有一些地方是错误的：

您正在检查val是否等于“Email[Required]和空字符串”。这是无效的，因为它们不能同时为这两个值

在电子邮件测试中，您需要根据email.val（）而不是jquery选择器进行测试

（！reEmail.test（email））

应该是

（！reEmail.test（email.val（））

您的代码有几个问题

flynfish已经确定了两个最重要的选项：）

错误：

名称为占位符*或*为空

而非

名称为占位符*且*为空

将

（！reEmail.test（email））

更改为

（！reEmail.test（email.val（））

以检查值

正则表达式只允许将

、

和

作为第二个字符。您也没有转义

，因此它表示任何字符，而不仅仅是一个点。也要转义

，因为JSLint/JSHint讨厌它未转义时：）

优化：

您不必检查电子邮件是占位符还是空字符串，因为这两个不正确的值不会通过regexp测试

不要在JS代码中硬编码占位符值。您可以使用

name.attr（'placeholder'）

访问占位符值。这样，如果更改占位符文本，就不必修改JavaScript

我建议使用新的

元素，并将Moderznir与任何支持电子邮件输入的html5表单一起使用。那会让你的工作轻松很多。您已经在使用moderznizr和polyfills作为占位符，所以请检查它是否也支持电子邮件输入验证