Jquery 对字段电子邮件的验证无效

我有一个单页应用程序。我需要在客户端验证我的字段。所以我使用 knockout.js。 我的查看页面上有两个字段，即电子邮件和密码。我想要的是，当我输入格式不正确的电子邮件id然后移动到密码时，它应该给出电子邮件的验证错误。简单地说，当输入格式错误的电子邮件id并按tab按钮时，我应该得到验证错误。我尝试了“required pattern=@”进行验证，但当Ajax调用完成时，它并不能很好地工作。所以我计划使用jquery来验证它

 HTML:-
      <p>
   <label>email:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input type="email" name="email"  class="formElement" data-bind='value: email'
     required pattern="@" /></label></p>
     <p>
     <label>password:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <input type="password"
      name="password" class="formElement" data-bind='value: password' /></label></p>

您可以在此处测试我的代码：-

您可以在此处尝试此功能，它可以工作：-

电子邮件：ko.observable.extend{//自定义消息 电子邮件：真的 },

     ko.validation.rules.pattern.message = 'Invalid.';
     ko.validation.configure({
     registerExtenders : true,
     messagesOnModified : true,
     insertMessages : true,
     parseInputAttributes : true,
     messageTemplate : null
});

     var modalViewModel= {
     email : ko.observable().extend({ // custom message
     required : {
     message : 'Please type your  email address.'
     }
     }),
      password: ko.observable()
     };
     ko.applyBindings(modalViewModel,document.getElementById('light'));

var User_Email_Id = $.trim($('#User_Email_Id').val());

if (! /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(User_Email_Id)){
  //error msg
    }