placeholder属性在IE9下有效吗_低版本表单提示替代方法【技巧】

IE9及更早版本原生不支持placeholder属性，需用'placeholder' in document.createElement('input')特性检测，不支持时用原生JS模拟，注意password类型安全处理。placeholder 属性在 IE9 及更早版本中完全无效，包括 <input> 和 <textarea> 标签。这不是兼容性“差”的问题，而是原生不支持——浏览器解析时直接忽略该属性。如何快速判断当前浏览器是否支持 placeholder别依赖 UA 字符串或版本号，用特性检测最可靠：if (!('placeholder' in document.createElement('input'))) { // IE9、IE8、IE7 等老浏览器走这里}这个判断比检查 navigator.userAgent 更准，也避免误判 Edge Legacy 或某些国产双内核浏览器。返回 false 表示不支持，需手动模拟注意：IE10+、Chrome 4+、Firefox 4+、Safari 5+、Opera 11.6+ 均返回 true该检测对 <textarea> 同样有效，无需单独测IE9 下模拟 placeholder 的最小可行方案不用引入整个 jQuery 或复杂 polyfill，几行原生 JS 就能覆盖核心行为：if (!('placeholder' in document.createElement('input'))) { document.querySelectorAll('input[placeholder], textarea[placeholder]').forEach(el => { const ph = el.getAttribute('placeholder'); el.setAttribute('data-placeholder', ph); el.placeholder = ''; // 清掉无效属性，避免干扰 const onInput = () => { if (el.value === ph) el.value = ''; el.classList.toggle('has-value', el.value !== ''); }; const onBlur = () => { if (!el.value) { el.value = ph; el.classList.remove('has-value'); } }; el.addEventListener('focus', onInput); el.addEventListener('blur', onBlur); el.addEventListener('input', onInput); onBlur(); // 初始化状态 });}关键点：只对带 placeholder 属性的元素生效，不影响其他输入框用 data-placeholder 保留原始值，避免被表单序列化误读监听 input 而非 keyup，兼容粘贴、拖入等操作初始调用 onBlur() 确保页面加载后提示文字就位::placeholder 伪元素在 IE9 下不能用CSS 自定义占位符样式（如颜色、字体）的 ::placeholder 伪类，IE9 完全不识别。连带的厂商前缀 ::-webkit-input-placeholder 和 ::-ms-input-placeholder 在 IE9 中也无效。 Cleanup.pictures 智能移除图片中的物体、文本、污迹、人物或任何不想要的东西