Question

我试图在我的textarea中使用javascript来显示文字，直到用户点击它为止。文本应在加载时显示，并在单击时消失。然而，我似乎反其道而行之。在用户单击该框并再次单击该文本框之前，我的文本不会显示加载？不太清楚我做错了什么。

<form action="upload.php" method="POST">

<input type="hidden" name="hidden_id" value="<?php print $id; ?>"/>
<input type="text" id="username" name="sent_by" onfocus="if (this.value == 'Your Name')
this.value = '';" onblur="if (this.value == '') this.value = 'Your Name';" maxlength="30"  
value="Your Name" />

<input type="text" id="user_email" name="sent_email" onfocus="if (this.value == 'Your Email')   
this.value = '';" onblur="if (this.value == '') this.value = 'Your Email';" maxlength="30" 
value="Your Email" />
<br /><br />

<textarea name="message" value="Enter Your Message Here..." cols="60" rows="5" 
id="artical_message" onfocus="if (this.value == 'Enter Your Message Here...') this.value = '';" 
onblur="if (this.value == '') this.value = 'Enter Your Message Here...';" ></textarea>

<p align="right">
<input name="submit_comment" type="submit" value="Send Message" class="contact_button">
</p>
</form>

Answer 1

textarea标记没有值属性。试试这个：http://jsfiddle.net/kudTF/

将内容放在<textarea>标记内。

<form action="upload.php" method="POST">

<input type="hidden" name="hidden_id" value="<?php print $id; ?>"/>
<input type="text" id="username" name="sent_by" onfocus="if (this.value == 'Your Name')
this.value = '';" onblur="if (this.value == '') this.value = 'Your Name';" maxlength="30"  
value="Your Name" />

<input type="text" id="user_email" name="sent_email" onfocus="if (this.value == 'Your Email')   
this.value = '';" onblur="if (this.value == '') this.value = 'Your Email';" maxlength="30" 
value="Your Email" />
<br /><br />

<textarea name="message" value="Enter Your Message Here..." cols="60" rows="5" 
id="artical_message" onfocus="if (this.value == 'Enter Your Message Here...') this.value = '';" 
onblur="if (this.value == '') this.value = 'Enter Your Message Here...';" >Enter Your Message Here...</textarea>

<p align="right">
<input name="submit_comment" type="submit" value="Send Message" class="contact_button">
</p>
</form>

Answer 2

替换：

<textarea name="message" value="Enter Your Message Here..." cols="60" rows="5" 
id="artical_message" onfocus="if (this.value == 'Enter Your Message Here...') this.value = '';" 
onblur="if (this.value == '') this.value = 'Enter Your Message Here...';" ></textarea>

with：

<textarea name="message" cols="60" rows="5" 
id="artical_message" onfocus="if (this.value == 'Enter Your Message Here...') this.value = '';" 
onblur="if (this.value == '') this.value = 'Enter Your Message Here...';" >Enter Your Message Here...</textarea>

Answer 3

首先，这是没有使用jQuery的内联Javascript。

使用类似的东西：

<script language="javascript">
$(document).ready(function() {
    $('#artical_message').val('Enter Your Message Here...')
        .focus(function(){
            if($(this.val() == 'Enter Your Message Here...'))
                $(this).val('');
        })
        .blur(function(){
            if($(this.val() == ''))
                $(this).val('Enter Your Message Here...');
        });
});
</script>

更新：哦，我的坏，我以为你在使用jQuery。好吧，对于初学者来说，文本区域没有任何价值，请使用innerHTML属性。

Answer 4

文本区域没有“值”属性，您的内容（在此处输入您的消息...）应该在结束标记之前，因此您的代码将类似

<form action="upload.php" method="POST">

<input type="hidden" name="hidden_id" value="<?php print $id; ?>"/>
<input type="text" id="username" name="sent_by" onfocus="if (this.value == 'Your Name')
this.value = '';" onblur="if (this.value == '') this.value = 'Your Name';" maxlength="30"  
value="Your Name" />

<input type="text" id="user_email" name="sent_email" onfocus="if (this.value == 'Your Email')   
this.value = '';" onblur="if (this.value == '') this.value = 'Your Email';" maxlength="30" 
value="Your Email" />
<br /><br />

<textarea name="message"  cols="60" rows="5" 
id="artical_message" onfocus="if (this.value == 'Enter Your Message Here...') this.value = '';" 
onblur="if (this.value == '') this.value = 'Enter Your Message Here...';" >Enter Your Message Here...</textarea>

<p align="right">
<input name="submit_comment" type="submit" value="Send Message" class="contact_button">
</p>
</form>

为什么我的textarea文本没有按预期显示/隐藏？

4 个答案: