自动填写输入框中的数据

I have four input boxes. If the user fills the first box and clicks a button then it should autofill the remaining input boxes with the value user input in the first box. Can it be done using javascript? Or I should say prefill the textboxes with the last data entered by the user?

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

3 个解决方案

#1

On button click, call this function

单击按钮，调用此函数。

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

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

#2

Yes, it's possible. For example:

是的,这是可能的。例如:

 <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>

with the javascript

与javascript

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

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

assuming you have jQuery aviable. You can see it working here: http://jsfiddle.net/ramsesoriginal/yYRkM/

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

Although I would like to note that you shouldn't include jQuery just for this functionality... if you already have it, it's great, but else just go with a:

尽管我想指出的是，您不应该仅仅为了这个功能而包含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 ;
 }

You can see that in action too: http://jsfiddle.net/ramsesoriginal/yYRkM/

您也可以在实践中看到:http://jsfiddle.net/ramsesoriginal/yYRkM/

#3

or if input:checkbox

如果输入:复选框

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

#1