我在HTML5中使用"占位符"属性。 我在带有HTML部分的PHP网页中使用它。 它按预期工作。
这是我的代码(它从w3schools网站略有修改(：
<!DOCTYPE html>
<html>
<body>
<form action="/nextpage.php">
<input type="text" name="firstname" placeholder="John"><br>
<input type="text" name="lastname" placeholder="Doe"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
作为网页的用户，我尝试使用带有占位符元素的表单并单击提交，但是如果我不更改以浅灰色显示的默认文本，则该字段就像是空的。
我希望文本是真实的 - 而不是表现得好像字段是空的。 如果用户更改字段中的占位符文本，则没关系。 但是，如果用户不触摸占位符文本，我希望"提交"单击以摄取占位符文本，就像用户手动键入它一样。 我该怎么做？ 我尝试了各种不同的东西，但我无法让它工作。 文本可能显示为黑色 - 但这并不重要。 如果用户不删除或更改文本，我希望文本位于字段中。
同时设置"值"参数
<input type="text" name="firstname" placeholder="John" value="John">
它将让用户删除占位符，但如果没有任何更改，则会发送
将占位符更改为值
<!DOCTYPE html>
<html>
<body>
<form action="/nextpage.php">
<input type="text" name="firstname" value="John"><br>
<input type="text" name="lastname" value="Doe"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
<script>
$("#firstname").on("click", function() {
$(this).val("")
});
$("#lastname").on("click", function() {
$(this).val("")
});
</script>
工作 JSFIDDLE ： http://jsfiddle.net/Yu97Z/291/
处理此类事情的一个好方法是在加载页面时为字段提供默认值。例如：
<input type="text" name="firstname" value="John" placeholder="John">
这将在输入字段中预填充"John"，这样如果用户选择不修改它，也不必修改它。也许这样，如果有人完全删除文本，placeholder阅读"名字"之类的内容也是有意义的。