2013-07-03 16 views
0

我很感興趣,如果可以更改佔位符的默認驗證消息。
必須是製作自定義消息的一種方式。需要HTML5佔位符 - 更改默認消息

我的形式:

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>HTML5 Placeholder</title> 
</head> 

<body> 
    <form> 
     <input type="text" id="email" maxlength="35" placeholder="E-mail" required> 
     <button type="submit">Ok</button> 
    </form> 
</body> 
</html> 

我試着用JavaScript但消息apears每次:HTML5的形式要求的屬性的

<script type="text/javascript"> 
document.getElementById('email').setCustomValidity('Please enter your e-mail!'); 
</script> 
+1

可能重複。設置自定義驗證消息?](http://stackoverflow.com/questions/5272433/html5-form-required-attribute-set-custom-validation-message) – djf

回答

0
<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.2.js'></script> 
</head> 

<body> 
    <form> 
     <input type="text" id="email" maxlength="35" placeholder="E-mail" required> 
     <button type="submit">Ok</button> 
    </form> 
    <script> 
    $(document).ready(function(){ 
    var elements = document.getElementsByTagName("INPUT"); 
    for (var i = 0; i < elements.length; i++){ 
     elements[i].oninvalid = function(e){ 
      e.target.setCustomValidity(""); 
      if (!e.target.validity.valid){ 
       e.target.setCustomValidity("This field cannot be left blank"); 
      } 
     }; 
     elements[i].oninput = function(e){ 
      e.target.setCustomValidity(""); 
     }; 
    } 
    }) 
    </script> 
</body> 

</html>