使用javascript设置表单字段占位符属性答案

【问题标题】：Set form field placeholder attribute using javascript使用javascript设置表单字段占位符属性
【发布时间】：2014-08-27 20:43:15
【问题描述】：

我正在尝试为我无权访问的表单设置占位符属性。我想使用该字段的名称来填充它。有谁知道使用 javascript 的方法。

这是表单域的html：

<input type="text" onchange="checkdep(this);" onblur="validatefield(this);" value="" name="First Name" class="formTextfield" id="First_Name">

我可以使用 getElementById 来做到这一点，但我想要一些适用于表单中所有字段的东西，而不必为每个字段单独设置。

http://jsfiddle.net/XF6wT/5/

谢谢

【问题讨论】：

如果页面中只有一个表单，您可以使用forms集合获取它：document.forms[0]。然后，您可以使用其elements 集合遍历表单中的所有控件。然后，您可以计算出您希望添加占位符的输入元素。

标签： javascript forms textfield placeholder

【解决方案1】：

试试这样的方法

var inputs = document.getElementsByTagName('input');
for (index = 0; index < inputs.length; ++index) {
   inputs[index].setAttribute('placeholder', inputs[index].getAttribute("name"));
}

JsFiddle

如果你需要把它约束成一个表格试试

var inputs = document.forms["form_name"].getElementsByTagName("input");

【讨论】：

谢谢，这正是我所要求的。相反，我选择了这里建议的解决方案，因为它处理了bradfrostweb.com/blog/post/float-label-pattern 出现的一些可用性问题

【解决方案2】：

你应该使用：

document.getElementById("First_Name").setAttribute('placeholder', document.getElementById("First_Name").getAttribute("name"));

你需要这个吗...我不确定..

检查一下：

更新：http://jsfiddle.net/XF6wT/6/

如果你想要表单的所有标签，那么你可以找到表单的所有标签并通过 for 循环添加。

【讨论】：

谢谢，但这仍然需要我命名每个特定元素。如果可能的话，我想要一些适用于表单中每个输入的东西。 jsfiddle.net/XF6wT/7