如何僅在電子郵件輸入字段有效時使用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？

回答

相關問題