使用jQuery從一個textarea刪除初始文本

Question

我有過的Symfony建有下面的代碼的textarea：

控制器：

$form = $this->createFormBuilder($defaultData) 
    ->add('name', 'text', array('label' => 'Name:')) 
    ->add('email', 'email', array('label' => 'Email Address:')) 
    ->add('subject', 'text', array('label' => 'Subject:')) 
    ->add('message', 'textarea', array('label' => 'Message:')) 
    ->getForm(); 

模板：

<div> 
    {{ form_errors(form.message) }} 
    <p class="label">{{ form_label(form.message) }}</p> 
    {{ form_widget(form.message, { 'attr' : { 'class' : 'input', 'id' : 'message', 'rows' : '8' } }) }} 
</div> 

，這導致以下HTML：

<div> 
    <p class="label"><label for="form_message" class="required">Message:</label></p> 
    <textarea id="form_message" name="form[message]" required="required" class="input" id="message" rows="8">Type your message here</textarea> 
</div> 

現在，當文本區域被關注時，我希望最初的文本消失。我只是不知道該怎麼做。我試過了：

$("#message").focus(function() { 
    if (this.text() == "Type your message here") { 
     this.text(""); 
    } 
}); 

但無濟於事。

Answer 1

你的代碼有幾個問題。

首先，對於textarea，您不使用.text()，而是使用.val()來代替許多其他表單對象。 參考聚焦功能中的對象，如$(this)而不是隻有this。 最後，你的文字區域有2個ID的#message和#form_message，只使用1個ID所以HTML結果：

<div> 
    <p class="label"><label for="form_message" class="required">Message:</label></p> 
    <textarea name="form[message]" required="required" class="input" id="message" rows="8">Type your message here</textarea> 
</div> 

和校正後的jQuery功能結果：

$("#message").focus(function() { 
    if ($(this).val() == "Type your message here") { 
     $(this).val(""); 
    } 
});