讓ie也兼容placeholder

時間 2019-12-07

標籤兼容 placeholder 简体版

原文原文鏈接

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>讓ie也兼容placeholder</title>
<style>
   input::-moz-placeholder{ color:#00f;}
   ::-webkit-input-placeholder{ color:#00f;}
</style>
<script src="../../js/jquery-1.7.2.js"></script>
<script>
$(function(){
   function placeHolder(wrapDom){
       var support='placeholder' in document.createElement('input');
           if(!support){
                var $pass=$("input[type=password]"),
               passL=$pass.length;
               if(passL){
                   $pass.hide().parent().append("<input type='text' value='請輸入密碼' class='pwdtext'/>");
                   $(".pwdtext").focus(function(){
                       $(this).hide().prev("input").show().focus();
                   })
               }
               wrapDom.find('[placeholder]').focus(function() {
                   var input = $(this);
                   if(input.val() == input.attr('placeholder')) {
                       input.val('');
                   }
               }).blur(function() {
                   var input = $(this);
                   if(/^password/.test(input.attr("id"))){
                       if(!input.val()) {
                           input.hide().next("input").show();
                       }
                   }
                   if(input.val() == '' || input.val() == input.attr('placeholder')) {
                       input.val(input.attr('placeholder'));
                   }
               }).blur();
           };
   }
   placeHolder($("#test"));
})
</script>
</head>

<body>
<form action="" method="post" id="test">
   <input type="text" name="username" id="username" placeholder="用戶名" />
   <input type="password" name="password" id="password" placeholder="密碼"/>
</form>
</body>
</html>

html

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。