Internet Explorer缺乏占位符支持，特别是密码字段。

Question

好的，为了克服IE不支持HTML5的占位符属性，我编写了一些JS来循环输入并设置输入的值，使其成为不支持它的浏览器的占位符属性值。现在这个方法很好用，但是对于密码字段，无论值是什么，都会以点/圆点的形式隐藏密码。

那么我可以采取哪些措施和方法来解决这个问题呢？

如何在input[type="password"]上实现占位符样式效果？

- benhowdle89

---

你可以再写一些 JavaScript :p - Saad Imran.

@SaadImran。只是想知道如何着手处理它... - benhowdle89

你可以将密码字段的背景颜色设置为透明，并在其下方放置一个白色的DIV来显示占位符... - Passerby

@benhowdle89 我会选择瓦伦蒂娜提供的选项1。 - Saad Imran.

@SaadImran。实际上我刚试了一下，不行。不确定IE怎么样，但在某些浏览器中，由于安全原因，JS不允许更改该属性，所以最好的方法是在元素外显示它，请查看Sathish的答案和这个问题：https://dev59.com/KWoy5IYBdhLWcg3wUcf_ - valentinas

或者可能是抄袭SO的方法。他们使用jQuery。 - Sreenath S

Answer 1

在查看“Web Forms：input placeholder”部分的HTML5跨浏览器Polyfills时，我看到了一个叫做jQuery-html5-placeholder的东西。

我尝试在IE9中使用演示，它似乎会将您的<input>包装在一个span中，并覆盖一个带有占位符文本的标签。

<label>Text:
  <span style="position: relative;">
    <input id="placeholder1314588474481" name="text" maxLength="6" type="text" placeholder="Hi Mom">
    <label style="font: 0.75em/normal sans-serif; left: 5px; top: 3px; width: 147px; height: 15px; color: rgb(186, 186, 186); position: absolute; overflow-x: hidden; font-size-adjust: none; font-stretch: normal;" for="placeholder1314588474481">Hi Mom</label>
  </span>
</label>

还有其他的 shim，但我没有查看它们所有的内容。

参考自 Input placeholders for Internet Explorer

- Sathish