HTML5 textarea占位符未显示 [英] HTML5 textarea placeholder not appearing
问题描述
我无法弄清楚我的标记有什么问题，但文本区域的占位符不会显示。看起来好像它可能被一些空白和标签覆盖。当你关注文本区域并从光标放置的地方删除时，然后离开文本区域，出现正确的占位符。
<！DOCTYPE HTML PUBLIC - // W3C // DTD HTML 4.01 // EN
http://www.w3.org/TR/html4/strict.dtd\">
< html>
< head>
< / head>
< body>
< form action =message.phpmethod =postid =message_form>
< fieldset>
< input type =emailname =emailid =emailtitle =电子邮件地址
maxlength =40
placeholder =电子邮件地址
autocomplete =offrequired />
< br />
< input type =text
name =subject
id =subjecttitle =Subject
maxlength =60placeholder =Subjectautocomplete =offrequired />
< br />
< textarea name =message
id =message
title =Message
cols =30
rows =5
maxlength =100
placeholder =消息必需>
< / textarea>
< br />
< input type =submitvalue =Sendid =submit/>
< / fieldset>
< / form>
< / body>
< script>
$（document）.ready（function（）{
$（'＃message_form'）。html5form（{
allBrowsers：true，
responseDiv：'＃响应'，
消息：'en'，
消息：'es'，
方法：'GET'，
colorOn：'＃d2d2d2'，
colorOff： '＃000'
}
）;
}）;
< / script>
< / html>
其他。简而言之，< textarea> 元素的开始和结束标记必须位于同一行，否则换行符会占用它。因此，占位符将不会显示，因为输入区域包含内容（换行符是技术上有效的内容）。
好：
< textarea>< / textarea>
不良：
< textarea>
< / textarea>
I cannot figure out what is wrong with my markup, but the placeholder for the text area will not appear. It seems as though it may be covered up with some blank spaces and tabs. When you focus on the text area and delete from where the cursor puts itself, then leave the text area, the proper placeholder then appears.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>
<body>
<form action="message.php" method="post" id="message_form">
<fieldset>
<input type="email" name="email" id="email" title="Email address"
maxlength="40"
placeholder="Email Address"
autocomplete="off" required />
<br />
<input type="text"
name="subject"
id="subject" title="Subject"
maxlength="60" placeholder="Subject" autocomplete="off" required />
<br />
<textarea name="message"
id="message"
title="Message"
cols="30"
rows="5"
maxlength="100"
placeholder="Message" required>
</textarea>
<br />
<input type="submit" value="Send" id="submit"/>
</fieldset>
</form>
</body>
<script>
$(document).ready(function() {
$('#message_form').html5form({
allBrowsers : true,
responseDiv : '#response',
messages: 'en',
messages: 'es',
method : 'GET',
colorOn :'#d2d2d2',
colorOff :'#000'
}
);
});
</script>
</html>
This one has always been a gotcha for me and many others. In short, the opening and closing tags for the <textarea> element must be on the same line, otherwise a newline character occupies it. The placeholder will therefore not be displayed since the input area contains content (a newline character is, technically, valid content).
Good:
<textarea></textarea>
Bad:
<textarea>
</textarea>
这篇关于HTML5 textarea占位符未显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
