html 文本水印,当用户输入文本创建为保持可见的输入端的HTML文本水印(Create an html waterma...

你好设置为答案，如果有人有相同的问题:)并为未来的参考，因为它似乎是你最后可能会使用该解决方案： http://jsfiddle.net/NXAWW/

这将保持水印的一部分，就像在其他网页样本文本框！ 祝你有个好的一天，

关键是这个

.keyup(function(){

var $input = $(this);

if ($input.val().trim() != '') {

$placeholder.val($input.val().trim() + $input.attr('placeholder').replace('test',''));

//$placeholder.val('');

} else {

$placeholder.val($input.val().trim() + $input.attr('placeholder').replace('test',''));

}

});

全jQuery代码

// Create placeholder input to serve as background

var $test = $('#test');

var $placeholder = $test.clone().removeAttr('id').removeAttr('placeholder').addClass('placeholder').val($test.attr('placeholder'));

var $container = $('');

$container.insertAfter($test).append($test).append($placeholder);

// Basic styling

$container.css({

position: 'relative'

});

$test.css({

position: 'absolute',

left: 0,

top: 0,

zIndex: 100,

backgroundColor: 'transparent',

borderColor: 'transparent'

});

$placeholder.css('color', 'transparent');

// Behavior for focus and blur to achieve the visual effect

$test.focus(function(){

var $input = $(this);

var $placeholder = $('.placeholder', $input.parent());

$placeholder.css('color', '#e0e0e0');

}).blur(function(){

var $input = $(this);

var $placeholder = $('.placeholder', $input.parent());

if ($input.val() == '')

$placeholder.css('color', 'transparent');

}).keyup(function(){

var $input = $(this);

if ($input.val().trim() != '') {

$placeholder.val($input.val().trim() + $input.attr('placeholder').replace('test',''));

//$placeholder.val('');

} else {

$placeholder.val($input.val().trim() + $input.attr('placeholder').replace('test',''));

}

});

​