Question

我有一个输入字段，您可以在其中键入一些文本。它有一些默认文本：

<input type="text" id="text" value="Type some text here" maxlength="35" tabindex="10">

我想在用户点击默认文字或输入字段内时使默认文字消失。

我该怎么做？

Answer 1

尝试使用占位符属性（占位符=＆＃34;您的文字＆＃34;而不是值=＆＃34;您的文字＆＃34;）：

<input type="text" id="text" maxlength="35" tabindex="10" placeholder="Type some text here">

注意：占位符属性在IE8 / 9或Opera Mini（http://caniuse.com/#feat=input-placeholder）中不起作用。

Answer 2

使用占位符属性

<input type="text" id="text" value="" maxlength="35" tabindex="10" placeholder="Type some text here">

如果您想支持旧浏览器：

<input type="text" id="text" value="Type some text here" maxlength="35" tabindex="10" onclick="this.value = (this.value == 'Type some text here' ? '' : this.value);">

http://jsfiddle.net/gLjt98af/

Answer 3

1）使用占位符属性

您可以使用占位符属性，如下所示。只要您不在文本框内单击，它就会显示。一旦你在里面输入任何内容，文本就会消失。

HTML

<input type="text" id="text" placeholder="Type some text here" maxlength="35" tabindex="10">

2）使用java脚本函数

HTML

<input type="text" id="text" value="Type some text here" maxlength="35" tabindex="10" 
onclick='cleartext()' onblur='settext()'>

JS

function cleartext(){
  document.getElementById('text').value= '';
}

function settext(){
  if(document.getElementById('text').value=== ''){
    document.getElementById('text').value= 'Type some text here' 
  }
}

Answer 4

您可以尝试以下方法，而不是使用占位符属性：

<input type="text" value="Type some text here" onfocus="if (this.value == 'Type some text here') {this.value=''}" />

如何使输入文本消失？

4 个答案: