javascript - 清除包含点击说明或输入文本时的说明的文本区域？

Question

我是 JavaScript 的新手，所以我不确定去哪里做这件事。

我有一个网页，用户可以在其中的文本框中输入消息。我想在盒子里放上它们的说明，这只是一个例子:

<TEXTAREA NAME="message" ROWS=10 COLS=80>Enter your text here</TEXTAREA>

当用户在此文本框内单击或开始输入文本时，我希望它立即清除说明文本。

我在网页上看到过这样做，但我找不到任何可以检查的内容。

Answer 1

您应该将其替换为占位符。

<textarea name="message" rows=10 cols=80 placeholder="Enter your text here"></textarea>

或者您可以通过绑定(bind) blur 和focus 的事件处理程序来做到这一点。

let message="Enter your text here";
$('textarea').focus(function(){
  if($(this).val() === message)
       $(this).val('');
});
$('textarea').blur(function(){
  if($(this).val().length === 0)
       $(this).val(message);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea name="message" rows=10 cols=80>Enter your text here</textarea>