如何在按键上空白文本框

Question

大家好，我是这方面的新手，我遇到了问题。我希望这里的任何人都可以帮助我。 我有一个输入框，默认值为“输入您的姓名”，该值即使在焦点上仍然保持不变。但我想要的是，当用户按下任何单词时，默认值应该被删除，并且应该输入他的值/她正在打字。

感谢任何帮助。

提前致谢， 梅加。

Answer 1

如果您想要简单的 HTML，而不是 HTML5 和 jQuery，请将以下内容添加到 HTML 标记中：

onfocus="if (this.value === 'ENTER YOUR NAME') this.value = ''"

将 ENTER YOUR NAME 替换为您想要的任何内容。

Answer 2

为此使用占位符属性

像这样：

<input  placeholder="ENTER YOUR NAME" type='text'>

但它只适用于支持 HTML5 的最新浏览器

Answer 3

适用于旧版浏览器，需要 javascript：

<input type="text" value="ENTER YOUR NAME" onblur="if(this.value === '') this.value = 'ENTER YOUR NAME';" onfocus="if(this.value === 'ENTER YOUR NAME') this.value = '';">

示例：http://jsfiddle.net/q4xKC/

适用于较新的浏览器 (http://caniuse.com/#search=placeholder)，需要 HTML5：

<input type="text" placeholder="ENTER YOUR NAME">

例如：http://jsfiddle.net/m65ea/

致您的更新：

阅读css/javascript form onfocus placeholder text still there, on typing disappear

Answer 4

您要求一种在按键上执行此操作的方法，而所有其他答案目前仅向您展示如何在 focus 或 blur 上执行此操作，所以除非我误解了这个问题，否则您实际上想要像这样：

document.getElementById("example").onkeydown = function(e) {
    if(this.value == "Enter something") {
       this.value = "";   
    }
}

这将要求您给您的input 一个id，在本例中为“示例”：

<input type="text" id="example">

这是上述代码的working example。

Answer 5

首先确保您使用 javascript 添加值，不要将其包含在您的标记中...否则任何没有 javascript 的人都必须手动删除文本，这对用户不太友好（除非您想要这种行为的）。

因此，您可以在 document.ready 上填充它，并且特定于您在按键上而不是在字段获得焦点时删除它的要求，您可以使用以下内容：

$(document).ready(function() {
  $("#nameField").val("ENTER YOUR NAME");
   $("#nameField").keypress(function() {
    if($(this).val() == "ENTER YOUR NAME") {
      $(this).val("");
    }
  });
});

附：如果你想确保它是一个单词字符，那么测试你想要删除当前内容的字符范围的事件数据。