Question

我是JavaScript的新手，所以我不确定在哪里这样做。

我有一个网页，用户可以在textarea框中输入消息。我希望在框中有他们的说明，这只是一个例子：

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

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

我已经在网页上看到过这种情况，但我找不到要检查的内容。

Answer 1

您只需将其替换为placeholder。

＆＃13;

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

＆＃13;

或者您可以binding和blur的{{1}}事件处理程序执行此操作。

＆＃13;

focus

＆＃13;

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);
});

＆＃13;

Answer 2

使用占位符来执行此操作

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

Answer 3

您好如果您想使用javascript或jquery，请尝试以下代码

＆＃13;

     $(function() {
    var defaultText = 'Enter your text here';
    $('#txt').focus(function() {
        defaultText = $(this).val();
        $(this).val('');
    }).blur(function() {
    if($(this).val().length === 0)
        $(this).val(defaultText); 
        
     });
 })

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<TEXTAREA NAME="message" id="txt" ROWS=10 COLS=80 >Enter your text here</TEXTAREA>

＆＃13;

Answer 4

将焦点事件附加到您的文字区域。

//assigns value to yext area

    document.getElementById("textarea").value = "this is an example";

    //does focus event
        document.getElementById("textarea").addEventListener("focus", myFocusMethod, true) ;

        function myFocusMethod(){
        document.getElementById("textarea").value = "";
        }

    //does click
    function doClick() {
    }

<TEXTAREA id="textarea" NAME="message" ROWS=10 COLS=80 onclick="doClick();"></TEXTAREA>

清除textarea包含有关单击或输入文本的说明？

4 个答案: