Question

我使用这个简单的函数在不支持它的浏览器中添加占位符：

问题是：当用户点击占位符时，如何添加该功能？

Answer 1

尝试使用removeAttr()之类的，

$('input,textarea').focus(function(){
   $(this).removeAttr('placeholder');
});

Demo

要在placeholder value再次获取blur()，请尝试使用

$('input,textarea').focus(function(){
   $(this).data('placeholder',$(this).attr('placeholder'))
          .attr('placeholder','');
}).blur(function(){
   $(this).attr('placeholder',$(this).data('placeholder'));
});

Demo 1

Answer 2

没有必要使用javascript函数来实现这一点，更简单的解决方案是：

<input type="text" placeholder="enter your text" onfocus="this.placeholder=''" onblur="this.placeholder='enter your text'" />

Answer 3

CSS为我工作：

input:focus::-webkit-input-placeholder {
    color: transparent;
}

Answer 4

 $('*').focus(function(){
  $(this).attr("placeholder",'');
  });

Answer 5

试试希望它有所帮助

$('input,textarea').focus(function()
{
$(this).attr('placeholder','');

});

Answer 6

$('input').focus(function()
{
  $(this).attr('placeholder','');

});

Answer 7

对于不支持占位符的浏览器，您可以使用： https://github.com/mathiasbynens/jquery-placeholder。正如HTML5一样添加占位符属性，然后调用此插件：$('[placeholder]').placeholder();。然后使用Rohan Kumar的代码并将跨浏览器。

Answer 8

$("input[placeholder]").each(function () {
    $(this).attr("data-placeholder", this.placeholder);

    $(this).bind("focus", function () {
        this.placeholder = '';
    });
    $(this).bind("blur", function () {
        this.placeholder = $(this).attr("data-placeholder");
    });
});

Answer 9

一个非常简单而全面的解决方案适用于Mozila，IE，Chrome，Opera和Safari：

<input type="text" placeholder="your placeholder" onfocus="this.placeholder=''" onblur="this.placeholder='your placeholder'" />

Answer 10

这是我点击非焦点的解决方案：

$(document).on('click','input',function(){
    var $this = $(this);
    var place_val = $this.attr('placeholder');
    if(place_val != ''){
        $this.data('placeholder',place_val).removeAttr('placeholder');
    }
}).on('blur','input',function(){
    var $this = $(this);
    var place_val = $this.data('placeholder');
    if(place_val != ''){
        $this.attr('placeholder',place_val);
    }
});

如何删除焦点上的占位符

10 个答案: