如何仅在电子邮件输入字段有效时使用onClick？

这里是代码：如何仅在电子邮件输入字段有效时使用onClick？

<input id="subscribe-email" type="email" placeholder="[email protected]" /> 
      <button type="submit" id="subscribe-submit" onClick="javascript:omgemailgone();" />

如何检查和（通过用户代理验证，没有额外的验证）运行JS功能只有当电子邮件是有效的？

UPDATE。新的浏览器可以自己验证input = email，还有伪类：有效和无效。只有当浏览器'知道'该电子邮件有效时，我才需要运行函数。

来源

2013-03-21 Demuri Celidze

可以使用输入元素的.checkValidity()方法（在这种情况下，我的电子邮件输入栏）。这将返回一个布尔值，指示输入是否有效。这里是玩小提琴：

http://jsfiddle.net/QP4Rc/4/

，代码：

<input id="subscribe-email" type="email" required="required" placeholder="[email protected]" /> 

<button type="submit" id="subscribe-submit" onClick="check()"> 
click me 
</button> 

function check() 
{ 
    if(!document.getElementById("subscribe-email").checkValidity()) 
    { 

    //do stuff here ie. show errors 
    alert("input not valid!"); 

    }else 
    { 
     callMeIfValid(); 
    } 
} 

function callMeIfValid() 
{ 
    //submit form or whatever 
    alert("valid input"); 
}

来源

2013-03-21 21:51:40 danii

谢谢，但不，不起作用。返回警报，但也运行其他的东西。 JSFiddle甚至没有警报。 [链接]（http://jsfiddle.net/Moor/j9t38/2/） – 2013-03-22 00:55:50

您正在测试哪个浏览器？我在Chrome，Firefox和Safari上检查了我的小提琴，并且警报显示正常。如果您希望某些代码只在电子邮件字段有效时才运行，则应该以其他条件添加代码。我会更新代码和小提琴。 – danii 2013-03-22 08:45:01

Chrome，IE10，Opera 12.的确，我解决了我的问题，只是改变了

您可以使用Regular expressions检查电子邮件是有效的您omgemailgone()：

function omgemailgone(){ 
    var mail = $('#subscribe-email').val(); 

    //Example of regular expression 
    if(mail.match(/YourRegexp/) 
    { 
     //Do stuff 
    } 
    else alert("Invalid e-mail"); 

}

（使用jQuery这里）

来源

2013-03-21 16:57:01 Bigood

对不起，好像我的问题是没有明确的要求。新的浏览器自己验证input = email。只有当浏览器'知道'该电子邮件有效时，我才需要运行函数。 – 2013-03-21 17:04:31

除此之外，你（1）忘了正则表达式的斜杠和（2）正则表达式与“[email protected]”等有效地址不匹配。 – 2013-03-21 18:24:26

我发现RFC2822验证模式，添加斜线，但似乎有与斜线冲突。这里有一个快照http://s3.hostingkartinok.com/uploads/images/2013/03/f027bc17748de792ec37d42125af9d61.png – 2013-03-22 08:25:59

u需要的是确认电子邮件，并返回真或假的函数 Validate email address in JavaScript?

<button type="submit" id="subscribe-submit" onClick="javascript:validateEmail(document.getElementById('subscribe-email').value) ? omgemailgone() : alert('email is wrong dude');" />

这是一个快速的解决方案，我建议你做正确，不使用内嵌的onclick JS

来源

2013-03-21 16:57:43

对不起，好像我的问题没有问清楚。新的浏览器自己验证input = email。只有当浏览器'知道'该电子邮件有效时，我才需要运行函数。 – 2013-03-21 17:02:50

html5 type =电子邮件在safari中不兼容。因此，每个人都可以通过下载safari来传递这层防御... javascript可以关闭，所以我建议使用php验证尽可能安全 – 2013-03-23 00:05:05

检查Validate email address in JavaScript?进行验证，然后如果你omgemailgone方法声明落实到一个（如果有效持续下去，否则什么都不做）

编辑：

function validateEmail(email) { 
    var re = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\ 
".+\"))@((\[[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); 
}

从链接

来源

2013-03-21 16:57:44

对不起，好像我的问题没有问清楚。新的浏览器自己验证input = email。只有当浏览器'知道'该电子邮件有效时，我才需要运行函数。 – 2013-03-21 17:05:02

那么你在寻找一种方法来访问验证的价值？ – 2013-03-21 17:26:21

如果它在一个表单中，那么在输入有效的电子邮件之前，提交按钮将不会执行任何操作。 – 2013-03-21 17:27:44

如何仅在电子邮件输入字段有效时使用onClick？

回答

相关问题