jquery執行本機瀏覽器驗證

如何使用jquery/javascript執行本機瀏覽器表單驗證，就好像用戶正在嘗試提交表單一樣？jquery執行本機瀏覽器驗證

<form id="myform"> 
    <input type="text" name="myinput" required /> 
    <input type="email" name="myemail" required /> 
</form> 

<div id="externalcheck">click to validate</div> 

<script type="text/javascript"> 
    $("#externalcheck").click(function(){ 
    // how to run html5 browser's validation ? 
    }); 
</scrpipt>

來源

2013-01-16 Mike

定義「* ...本地警告系統... *」？ :) – Alexander

是的，現代瀏覽器概括了無效表單的字段並顯示一條警告消息。我解釋了嗎？ – Mike

看一看[this]（http://stackoverflow.com/a/5688798/1558311）回答 –

-1

您可以迭代輸入並檢查它們是否有效。

$("#externalcheck").click(function() { 
    $('#myform input').each(function() { 
     if (!this.checkValidity()) { 
      alert($(this).prop('name') + ' is not valid'); 
     } 

    }); 
});

http://jsfiddle.net/sWxE9/

來源

2013-01-16 18:27:11

我知道它，但我不想顯示警報 – Mike

看到這個演示：http://jsfiddle.net/3JeZ6/10/

這裏是它的一個HTML：

<style> 
     .valid { color: #0d0; } 
     .invalid { color: #d00; } 
    </style>  
    <form id="testform" action="/"> 
     <label>Required: 
     <input id="required_input" required=""> 
     </label><br> 
     <label>Pattern ([0-9][A-Z]{3}): 
     <input id="pattern_input" pattern="[0-9][A-Z]{3}"> 
     </label><br> 
     <label>Min (4): 
     <input id="min_input" type="number" min="4"> 
     </label><br> 
     <input type="submit" value="Submit Button" id="sbmt" /> 
    </form> 
    <input type="button" value="Trigger click on submit button" id="test"> 
    <input type="button" value="Trigger form submit" id="test1"> 
    <input type="button" value="Run checkValidity" id="test2">

也就是瘋了，至於我，但簡單form.submit()真的不起作用。但是，如果你觸發一個提交按鈕點擊 - 一切正常：

$("#test").click(function(){ 
    $("#sbmt").click(); // works fine 
}) 
$("#test1").click(function(){ 
    $("#testform").submit();// does not work 
}) 
$("#test2").click(function(){ 
    alert($("#testform")[0].checkValidity() ? "valid": "not valid"); // result looks to be correct, but it does not highlight fields that are not valid 
})

我已經確認按照最新的Chrome行爲和FireFox

來源

2013-01-16 18:54:40

我與阿賈克斯的例子。

var $form = $('form'); 

$form.find(':submit').on('click', function (evt) { 
    // If the validation fails, return true and the form is processed as standard 
    if($form[0].checkValidity() === false) { 
     return true; 
    } 

    evt.preventDefault(); 

    $.post('/', $form.serialize(), function (response) { 
     // Handling the response 
    }) 
})

來源

2014-03-14 09:53:39 dakiesse

jquery執行本機瀏覽器驗證

回答

相關問題