jquery - 使用 jQuery 将值插入输入字段？

Question

在下面的代码中，我想使用 jQuery 将单词 "username" 放入值字段中。然后，当用户选择输入框时，“用户名”一词将消失，留下一个空的输入字段供用户输入他的用户名。

这可以用 jQuery 来完成吗？

<p class="login-username">
    <input type="text" name="log" id="user_login" class="input" value="" size="20" tabindex="10">
</p>

Answer 1

您可以使用 HTML5 占位符 来实现

<input type="text" placeholder="Username" />

并针对旧版浏览器修复它(这正是您所要求的部分)

$('[placeholder]').focus(function() {
  var input = $(this);
  if (input.val() == input.attr('placeholder')) {
    input.val('');
    input.removeClass('placeholder');
  }
}).blur(function() {
  var input = $(this);
  if (input.val() == '' || input.val() == input.attr('placeholder')) {
    input.addClass('placeholder');
    input.val(input.attr('placeholder'));
  }
}).blur();

SOURCE

<小时/>

更新

要通过 jQuery 更改 HTML 并向输入字段添加占位符，您可以执行以下操作

$("input").prop("placeholder", "username");

DEMO