Cách sử dụng onClick CHỈ nếu trường nhập email hợp lệ?

Question

Đây là mã:

<input id="subscribe-email" type="email" placeholder="john.doe@example.com" /> 
      <button type="submit" id="subscribe-submit" onClick="javascript:omgemailgone();" /> 

Làm thế nào để kiểm tra và chạy chức năng JS chỉ khi email là hợp lệ (validation bởi user-agent, không có kiểm chứng thực bổ sung)?

CẬP NHẬT. Trình duyệt mới có thể xác thực đầu vào = email của chính chúng, cũng có các lớp giả: hợp lệ và: không hợp lệ. Tôi chỉ cần chạy chức năng nếu trình duyệt 'biết' rằng email hợp lệ.

Answer 1

Bạn có thể sử dụng phương pháp .checkValidity() của phần tử đầu vào (trong trường hợp này, gửi email cho tôi trường nput). Điều này sẽ trả về một boolean cho biết kết nối đầu vào có hợp lệ hay không. Đây là một fiddle để chơi với:

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

Và mã:

<input id="subscribe-email" type="email" required="required" placeholder="john.doe@example.com" /> 

<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"); 
} 

Answer 2

Bạn có thể sử dụng Regular expressions để kiểm tra email có giá trị trên bạn omgemailgone():

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

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

} 

(sử dụng jQuery đây)

Answer 3

u cần một hàm xác nhận email và trở về đúng hay sai 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');" /> 

Đây là một giải pháp nhanh chóng, tôi khuyên bạn nên làm điều đó đúng, không sử dụng inline onclick js

Answer 4

séc Validate email address in JavaScript? để xác nhận và sau đó thực hiện nó thành một câu lệnh if trong phương pháp omgemailgone của bạn (nếu có giá trị tiếp tục, nếu không làm gì cả)

chỉnh sửa :

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); 
} 

từ liên kết