操作textarea值，以便在各種情況下顯示默認消息

Question

以下是它的工作原理。在自然狀態下顯示一條消息。當用戶將注意力集中在textarea上時，消息就消失了。如果用戶的焦點超出了信息顯示的textarea。

我的問題是，我只希望在開始時顯示消息，並且當且僅當在文本字段中沒有用戶書寫文本時。即使用戶開始鍵入時，即使他沒有關注textarea，也不會顯示消息並且用戶文本仍然存在。如果用戶清除了textarea而不是消息顯示時的焦點。

我的問題是確保消息在用戶輸入一些信息後不顯示。

下面是我試過的。

$(function() { 

     // Initiate the textarea placeholder content 
     if($(".more").val() != '') { 

     var content = "Please provide any feedback from your experience or/and any features you would like to be added or removed."; 
     // Empty it's value upon select 
     $(".more").val(content); 
     } 
     $(".more").focus(function(event) { 
      // Erase text from inside textarea 

      if($(this).val() != '') { 
       $(".more").val(''); 
      } 
     }); 

     // Display the placeholder when the textarea is out of focus. Ensure that its empty. 
     $(".more").focusout(function(event) { 
      // Erase text from inside textarea 
      if($(this).val() == '') { 
      $(this).val("Please provide any feedback from your experience or/and any features you would like to be added or removed."); 
      } 

     }); 
    }); 

Answer 1

你的問題是，在這個下面的框，你被清除文本區域，如果它不爲空，你不應該這樣做，你要清楚的文本區域，如果它匹配一些默認text.So用戶鍵入的文本並不在重點清除。

if($(this).val() != '') { 
    $(".more").val(''); 

1.By默認情況下，插入一些默認的文本。
2.注意，如果文本區域是空的插入默認值。
3.重點關注，如果文本區域值等於默認文本，則清空文本區域。

試試這個。

var DefaultText = "Please provide any feedback from your experience or/and any features you would like to be added or removed." 
 

 
$('#temp').val(DefaultText); 
 

 
$('#temp').focusout(function(event) { 
 
    if ($(this).val() == '') $(this).val(DefaultText); // add default text if there is no text 
 
}); 
 

 
$('#temp').focusin(function(event) { 
 
    if ($(this).val() == DefaultText) // remove text only if it default text 
 
    $(this).val(''); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea id='temp'></textarea>

Answer 2

試試這個

<textarea placeholder="Enter your biography here"></textarea>