jQuery表單URL驗證自定義消息

Question

我已包含jquery文件並遵循HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

HTML：

<form action="http://www.google.com" onSubmit="return validate();">
        <input type="url" required="true" name="URL" >
        <input type="submit" value="Submit">
</form> 

當我提交帶有空白字段的表單時，請輸入消息“請填寫該字段”。 我想給我自定義消息。

我能怎么做？

Answer 1

您可以使用setCustomValidity ：

<form action="http://www.google.com" onSubmit="return validate();">
  <input type="url"
    oninvalid="setCustomValidity('custom message ')"
    onchange="try{setCustomValidity('')}catch(e){}" required="true"  />
  <input type="submit" value="Submit">
</form> 

在mozilla中，可以使用以下方法實現：

x-moz-errormessage="custom message"

在您的情況下，有兩種情況； 空白和自定義消息。 對於此特定條件，以下代碼將起作用：

<form action="http://www.google.com" onSubmit="return validate();">
  <input type="url"
    oninvalid="setCustomValidity(validity.typeMismatch
                                      ? '(custom) wrong url '
                                      : '(custom)Field cannot be blank ')"
    onchange="try { setCustomValidity('') } catch (e) {}" required="true"  />
  <input type="submit" value="Submit">
</form> 

您可以根據需要編寫自己的代碼，請參閱下一頁

約束驗證：Web窗體的本機客戶端驗證

也嘗試以下鏈接，我還沒有嘗試過，但這可能對您有幫助，HTML5中的自定義消息