如何修复Internet Explorer的占位符？

Question

我想拥有文本和密码输入字段的占位符。除了Internet Explorer之外，我可以做到这一点。如何才能做到这一点？也许jquery？特别对于密码，我希望占位符说“密码”。一旦输入被点击，其中的文本将显示为密码文本。谢谢！ :)

Answer 1

IE9 +假设支持占位符，但我发现情况并非如此。有几种方法可以“假装”拥有占位符。我发现在IE上拥有占位符外观/感觉的最佳方式是创建一个jquery函数，在输入框后面添加一个div（使输入框透明）并显示您想要显示的文本。然后当输入或数据出现时，A显示：无div或不透明输入框。

其他人将文本放在输入字段中，但这可能会带来验证的麻烦，并且您可以找到密码字段。

类似：

// Check browser type so we don't mess with other browsers that do this right 
if (BrowserDetect.browser === 'Explorer') { 
    // Find all placeholders 
    $('[placeholder]').each(function(_index, _this) { 
     var $this = $(this); 
     var id = this.id; 
     var thisValue = $this.val(); 
     var value = $this.attr('placeholder'); 
     var $element = $('#' + id + '_ph'); 
     if ($element.length === 0) { 
      // Add placeholder if no input you want to add it even if value in case they remove value 
      $this.attr('placeholder', ''); 
      // Add the div (make sure you style ie_placeholder_fix 
      // class with correct positioning etc) 
      $('<div id="' + id + '_ph" class="ie_placeholder_fix">' + value + '</div>').insertAfter($this); 
     } 
     //Maybe you want to hide if it has a value? 
     if (thisValue) { $element.hide(); } else { $element.show(); } 
     $this.blur(checkForInput); 
    }); 
} 

您只需要检查他们是否有一个值是否隐藏DIV如果值是预先填充（即一个可编辑的形式）