Question

我不完全确定这是否可能，我对jQuery和JavaScript的知识非常了解，但这个让我很难过。我创建了一个简单的插件，清除焦点上的文本输入，然后显示默认值，如果没有输入任何内容。

是否可以淡出文本输入中的文本本身，而不是整个字段本身？所有尝试似乎都会导致文本字段本身逐渐淡出并最终将元素隐藏起来。

我确实提出了一个使用包含默认值的跨度的解决方案，并将它们绝对定位在文本输入上，隐藏并显示它们，具体取决于用户是否输入了任何文本。如果存在，我宁愿采用一种直接的方法。

修改

使用jQuery UI中的jQuery animate函数或作为jQuery的插件可用，您可以将文本颜色设置为焦点和模糊字段时的输入颜色（如下所述）。这是我正在使用的代码，如果你想知道如何。

    obj.bind("focus", function() {
  if ($(this).val() == oldValue) {
      $(this).animate({ color: '#E8DFCC' }, 1000).val('');
  }
 });

 obj.bind("blur", function() {
  if ($(this).val().length <= 3) {
      $(this).animate({ color: '#56361E' }, 600).val(oldValue);
  }
 });

Answer 1

只是想一想，您是否尝试使用动画方法更改文本框中文本的颜色以匹配背景？然后，当动画完成时，您可以清除内容。

这是一个想法。自从我使用动画之后已经有一段时间了，但是如果你感兴趣的话，我可能会提出代码示例。

Answer 2

这就是我用于此的内容。首先将此添加到您的JavaScript包括： http://plugins.jquery.com/project/color

然后这样做：

$('.search-input').focus(function(){
    if($(this).val() == 'Default Text'){
        $(this).animate({
            color: '#fff'
            //your input background color.
        }, 500, 'linear', function(){
            $(this).val('').css('color','#000'); 
            //this is done so that when you start typing, you see the text again :P
        });
    }
}).blur(function(){
    if($(this).val() == ''){
        $(this).val('Default Text').css('color','#fff');
        $(this).animate({
            color: '#000'
        }, 500, 'linear');
    }
});

这样做会将文本淡化为背景颜色，然后清空输入字段。在模糊处首先显示默认文本，然后将其淡化为原始颜色。

幻觉：）

如果你不想真正清除这个字段，你可以删除很多。但是你明白了。这里的关键是两件事。使用颜色插件和.animate（）效果。

Answer 3

我刚遇到这个问题，我的解决方案很简单，只需将属性“value”更改为''即可。这基本上将取代文本。

$(selector).attr('value', '');

使用jQuery淡出文本字段内的文本值

3 个答案: