Javascript 如何在单击时清除文本区域？

给定一个具有如下默认值的

：

<textarea>Please describe why</textarea>

请描述原因

当用户单击编辑字段时，如何清除默认值？

请说明原因
<textarea onClick="javascript: this.value='';">Please describe why</textarea>

您的JavaScript：

function clearContents(element) {
  element.value = '';
}

以及您的HTML：

<textarea onfocus="clearContents(this);">Please describe why</textarea>

请描述原因

我想你会想让它更健壮一点，这样在第二次聚焦时就不会擦除用户输入

以下是David Dorward在上述评论中提到的问题：

<label for="explanation">Please describe why</label>
<textarea name="explanation" id="explanation"></textarea>

请描述原因

试试：

---

您是指像这样的文本字段吗

<input type="text" onblur="if(this.value == '') this.value='SEARCH';" onfocus="if(this.value == 'SEARCH') this.value='';" size="15" value="SEARCH" name="xSearch" id="xSearch">

还是这是给textarea的

<textarea id="usermsg" rows="2" cols="70" onfocus="if(this.value == 'enter your text here') this.value='';" onblur="if(this.value == '') this.value='enter your text here';" >enter your text here</textarea>

在此处输入文本

目前为止我所知道的最佳解决方案：

<textarea name="message" onblur="if (this.value == '') {this.value = 'text here';}"   onfocus="if (this.value == 'text here') {this.value = '';}">text here</textarea>

这里的文本

您可以使用HTML5中引入的占位符属性：

<textarea placeholder="Please describe why"></textarea>

这会将填充文本置于灰色，当用户单击文本字段时，填充文本将自动消失。此外，如果它失去焦点且文本区域为空，它将重新出现。

在此处写入内容。。。。。。。。。。。。。。
<textarea name="post" id="post" onclick="if(this.value == 'Write Something here..............') this.value='';" onblur="if(this.value == '') this.value='Write Something here..............';" >Write Something here..............</textarea>

这是您的javascript文件：

function yourFunction(){
     document.getElementById('yourid').value = "";
};

这是html文件：

    <textarea id="yourid" >
    Your text inside the textarea
    </textarea>
    <button onClick="yourFunction();">
     Your button Name
     </button>

文本区域内的文本
您的按钮名称

jQuery attribute val（）应该执行此任务。

---

您可以执行

$（'#YourTextareaID'）。单击（函数（e）{e.target.value=''；}）

您可以尝试此代码

<textarea name="textarea" cols="70" rows="2" class="searchBox" id="textarea" onfocus="if(this.value == 'Please describe why') this.value='';" onblur="if(this.value == '') this.value='Please describe why';">Please describe why</textarea>

请描述原因

如果您有来自数据库的动态数据，这里有一个解决方案…
“data”变量表示数据库数据。
如果尚未保存任何数据，则将显示占位符。
一旦用户开始键入，占位符将消失，然后他们可以输入文本。

希望这对别人有帮助

// If data is NOT saved in the database
if (data == "") {
    var desc_text = "";
    var placeholder = "Please describe why";
// If data IS saved in the database
} else {
    var desc_text = data;
    var placeholder = "";
}

<textarea placeholder="'+placeholder+'">'+desc_text+'</textarea>

//如果数据未保存在数据库中
如果（数据==“”）{
var desc_text=“”；
var placeholder=“请说明原因”；
//如果数据保存在数据库中
}否则{
var desc_text=数据；
var占位符=”；
}
“+desc_text+”

无需脚本。您可以将

onblur

和

onfocus

与

占位符结合使用，使文本消失并显示在文本区域中


请使用真实的
s
，不要滥用默认值作为假标签。除了语义上的垃圾之外，这给屏幕阅读器用户带来了一个真正的问题，因为当元素获得焦点时，告诉他们在字段中放置什么的唯一信息消失了……屏幕阅读器在获得焦点之前不会读取字段中的文本！这不是文本区，所以-1。这只会删除示例文本，因此+1。for属性需要匹配id，而不是名称！（否则它将与单选按钮不兼容）您应该去掉
javascript:
位。这是一个没有后路的标签。如果使用内部事件属性，则需要指定使用的语言，但这是通过元标记实现的，而不是标签：奇怪。带有
标签的第二个想法对我不起作用。此解决方案在用户每次单击文本字段时都会将其清除。我的版本仅清除默认值。Dolph的解决方案清除textfield/textarea中的所有内容，而不仅仅是默认值。这不是真的。当用户开始写入而不是单击时，它将消失。
// If data is NOT saved in the database
if (data == "") {
    var desc_text = "";
    var placeholder = "Please describe why";
// If data IS saved in the database
} else {
    var desc_text = data;
    var placeholder = "";
}

<textarea placeholder="'+placeholder+'">'+desc_text+'</textarea>