自动在输入框中填充数据答案

【问题标题】：Fill data in input boxes automatically自动在输入框中填充数据
【发布时间】：2012-02-10 10:34:37
【问题描述】：

我有四个输入框。如果用户填写第一个框并单击一个按钮，那么它应该使用第一个框中的用户输入值自动填充剩余的输入框。可以使用javascript完成吗？或者我应该说用用户输入的最后一个数据预填充文本框？

【问题讨论】：

是的，可以使用 JavaScript。你试过什么？如果你表现出一些努力，人们会更乐意帮助你。

【解决方案1】：

点击按钮时，调用此函数

function fillValuesInTextBoxes()
{
    var text = document.getElementById("firsttextbox").value;

    document.getElementById("secondtextbox").value = text;
    document.getElementById("thirdtextbox").value = text;
    document.getElementById("fourthtextbox").value = text;
}

【讨论】：

谢谢。它工作正常。但是如果我想用用户输入的最后一个数据来填充其余部分怎么办？而不是一开始就输入固定的数据。

【解决方案2】：

是的，这是可能的。例如：

 <form id="sampleForm">
     <input type="text" id="fromInput" />
     <input type="text" class="autofiller"/>
     <input type="text" class="autofiller"/>
     <input type="text" class="autofiller"/>
     <input type="button"value="Fill" id="filler" >
     <input type="button"value="Fill without jQuery" id="filler2" onClick="fillValuesNoJQuery()">
 </form>

用javascript

 function fillValues() {
       var value = $("#fromInput").val();
       var fields= $(".autofiller");
       fields.each(function (i) {
         $(this).val(value);
       });
 }

 $("#filler").click(fillValues);

假设你有jQuery aviable。你可以在这里看到它的工作原理：http://jsfiddle.net/ramsesoriginal/yYRkM/

虽然我想指出，你不应该仅仅为了这个功能而包含 jQuery……如果你已经拥有它，那就太好了，但否则只需使用：

 fillValuesNoJQuery = function () {
       var value = document.getElementById("fromInput").value;
       var oForm = document.getElementById("sampleForm");
       var i = 0;
       while (el = oForm.elements[i++]) if (el.className == 'autofiller') el.value= value ;
 }

您也可以看到这一点：http://jsfiddle.net/ramsesoriginal/yYRkM/

【讨论】：

【解决方案3】：

或者如果输入：复选框

document.getElementById("checkbox-identifier").checked=true; //or ="checked"

【讨论】：