Question

如果用户不填写任何内容，是否有办法将占位符用作表单中的值？

Answer 1

是的，您可以使用值属性

<input type='text' placeholder='Name' value='Name' />

你的问题很短，而且你没有提供任何其他细节，所以我可能无法告诉你究竟想要用它做什么。

Answer 2

您可以使用一些JavaScript在提交表单之前查看表单字段中的值，并查看是否有任何值为空，然后在占位符中替换（如果需要）。

这样的东西（但是你可能需要考虑针对旧版浏览器的polyfill，而不是占位符，具体取决于你想要支持的浏览器集）：

<!DOCTYPE html>
<html>
    <head>
        <title>Placeholder</title>
    </head>
    <body>
        <form action="#" onsubmit="return validateForm();">
            <input type="text" name="manufacturer" id="manufacturer" placeholder="Fiat"><br>
            <input type="text" name="model" id="model" placeholder="500"><br>
            <input type="submit" value="Submit">
        </form>
        <script type="text/javascript">
            function validateForm() {
                var manufacturer = document.getElementById('manufacturer'),
                    model = document.getElementById('model');

                if (manufacturer.value.length === 0) {
                    manufacturer.value = manufacturer.placeholder;
                }

                if (model.value.length === 0) {
                    model.value = model.placeholder;
                }

                return true;
            }
        </script>
    </body>
</html>

这不使用“value”，因此不能有效地使用值预先填充表单，并让占位符值正确呈现。

使用占位符值作为表单中的默认值？

2 个答案: