placeholder IE失效问题
来源：互联网 发布：小米4怎么设置2g网络 编辑：程序博客网 时间：2024/06/10 08:47
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script type="text/javascript" src="Scripts/jquery-1.4.1.min.js"></script><script type="text/javascript"> //第一种方法 $(document).ready(function () { var doc = document, inputs = doc.getElementsByTagName('input'), supportPlaceholder = 'placeholder' in doc.createElement('input'), placeholder = function (input) { var text = input.getAttribute('placeholder'), defaultValue = input.defaultValue; if (defaultValue == '') { input.value = text } input.onfocus = function () { if (input.value === text) { this.value = '' } }; input.onblur = function () { if (input.value === '') { this.value = text } } }; if (!supportPlaceholder) { for (var i = 0, len = inputs.length; i < len; i++) { var input = inputs[i], text = input.getAttribute('placeholder'); if (input.type === 'text' && text) { placeholder(input) } } } }); //第二种方法 $(function () { if (!placeholderSupport()) { // 判断浏览器是否支持 placeholder $('[placeholder]').focus(function () { var input = $(this); if (input.val() == input.attr('placeholder')) { input.val(''); input.removeClass('placeholder'); } }).blur(function () { var input = $(this); if (input.val() == '' || input.val() == input.attr('placeholder')) { input.addClass('placeholder'); input.val(input.attr('placeholder')); } }).blur(); }; }) function placeholderSupport() { return 'placeholder' in document.createElement('input'); }</script></head><body><form> <label for="name">用户名：</label> <input type="text" placeholder="请输入用户名"/></form></body></html>
