Question

您可能认为此问题已经得到解答。

然而，我找不到合适的代码来实现这一周。

Jquery网站不支持用户在浏览器上下载其占位符文件。

占位符应该适用于IE 7和IE 8。
如果我可以使用Jquery，那将会很棒。
当用户点击输入框时，我希望它不会消失，直到用户真正开始输入值。
它也应该用于密码输入。（密码字框应显示“密码”）

你能帮我解决这个问题吗？

新用户找到新答案会有好处。

Answer 1

您可以使用

 $(function() {

    if(!$.support.placeholder) { 

        var active = document.activeElement;

        $(':text').focus(function () {

            if ($(this).attr('placeholder') != '' && $(this).val() == $(this).attr('placeholder')) {

                $(this).val('').removeClass('hasPlaceholder');

            }

        }).blur(function () {

            if ($(this).attr('placeholder') != '' && ($(this).val() == '' || $(this).val() == $(this).attr('placeholder'))) {

                $(this).val($(this).attr('placeholder')).addClass('hasPlaceholder');

            }

        });

        $(':text').blur();

        $(active).focus();

        $('form').submit(function () {

            $(this).find('.hasPlaceholder').each(function() { $(this).val(''); });

        });

    }

});

在CSS中添加：

.hasPlaceholder {
    color: #777;
}

Answer 2

我推荐使用In-Field Labels jQuery插件

http://fuelyourcoding.com/scripts/infield/

我将它与http://modernizr.com/结合起来检查是否支持占位符：

if (!Modernizr.input.placeholder) {
  $("input, textarea").inFieldLabels();
}

Answer 3

对我来说，以下工作非常适合在IE8中使用占位符功能：

这是HTML：

<input id="user_userid" name="user_userid" placeholder="User-ID" type="text" value="" />

这是Coffeescript代码：

$(document).ready -> 

  if (document.all && !document.addEventListener) 
    $('input[placeholder]').each  ->     
      input = $(this) 
      input.closest('form').submit -> 
        if (input.val() == input.attr('placeholder')) 
          input.val('')

“... document：addEventListener ...”行检查IE8或更早版本。使用此代码，在提交包含表单时会发生占位符处理。

致以最诚挚的问候，

基督教 http://www.agile-methoden.de

占位符在Internet Explorer上不起作用

3 个答案: