ie placeholder屬性的相容性問題

2021-06-19 13:02:10 字數 1413 閱讀 2402

html 5 有個很棒的屬性,placeholder,在滑鼠聚焦到上面時候,提示文字會消失,失去焦點之後,又會出現:

但是在不支援html5的低版本的瀏覽器中,placeholder屬性是無效的,為了解決這個問題,因此,人為的去實現placeholder屬性:

//placeholder功能實現

var placeholder =

else

});el.bind('focus', self._onfocus);

el.bind('click', self._onfocus);

el.bind('blur', self._onblur);

el.bind('keyup', self._onkeyup);}},

remove: function (el)

},check: function (el)

});}

},clear: function ()

});$('textarea').each(function (el)

});}

},_onfocus: function () ,

_onblur: function ()

else

},_onkeyup: function ()

else }};

使用時候:

placeholder.add($('input[type="text"]'));

placeholder.add($('textarea'));

需要注意的是,考慮到如果input的type是password的時候,placeholder顯示的是.....的屬性

這種情況下,解決方法為:

給定兩個輸入框,

乙個是text,乙個為password的,

在有焦點的時候,切換為password,失去焦點的時候,切換為text用來展示placeholder屬性.

<inputtype="text"id="pwd"value="請輸入密碼"/>

<inputtype="password"id="password"style="display:none;"/>

CSS屬性 背景屬性 or 浮動屬性

background color red background image url background repeat no repeat repeat repeat x repeat y background position 水平位置 垂直位置 可以給負值 background attachme...

復合屬性 列表屬性 文字屬性

background 復合屬性 url 位址 本地位址,網路位址 repeat 預設值 水平和垂直都鋪滿 repeat x 只鋪滿水平方向 左右 repeat y 只鋪滿垂直方向 上下 no repeat 不平鋪 放不滿,留出空白 background size 100 100 背景縮放 boxba...

CSS屬性 文字屬性 or 列表屬性

font weight bolder 更粗的 bold 加粗 normal 常規 lighter 細的 font weight 100 900 100 500 不加粗 600 900 加粗 常用 100 細體 400 正常 700 加粗 900 更粗 font style italic 傾斜字 ob...