我有以下代码,当用户选择一个输入框时,该值将消失,但一旦用户点击它,默认值将被重新插入。
$(function() {
var defaultText = '';
$('input[id=input]').focus(function() {
defaultText = $(this).val();
$(this).val('');
});
$('input[id=input]').blur(function() {
$(this).val(defaultText);
});
});
然而,这并不是我想要的。如果用户插入文本,我不希望默认文本覆盖用户输入的内容。我也是 jQuery 的新手,所以非常感谢任何帮助。
最佳答案
在您的 focus()
方法中,您应该在清除它之前检查它是否等于 defaultText
,在您的 blur()
中函数,您只需要在设置defaultText
之前检查val()
是否为空。如果您要使用多个输入,最好使用类而不是 ID,因此当类为“输入”时,您的选择器将是 input.input
。即使它是一个 ID,您也可以将其引用为 input#input
。
// run when DOM is ready()
$(document).ready(function() {
$('input.input').on('focus', function() {
// On first focus, check to see if we have the default text saved
// If not, save current value to data()
if (!$(this).data('defaultText')) $(this).data('defaultText', $(this).val());
// check to see if the input currently equals the default before clearing it
if ($(this).val()==$(this).data('defaultText')) $(this).val('');
});
$('input.input').on('blur', function() {
// on blur, if there is no value, set the defaultText
if ($(this).val()=='') $(this).val($(this).data('defaultText'));
});
});
在 this jsFiddle 中将其付诸实践.
关于javascript - jQuery 输入值焦点和模糊,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13182921/