自动填充输入框中的数据

时间:2012-02-10 10:34:38

标签: javascript html

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

3 个答案:

答案 0 :(得分:5)

点击按钮,调用此功能

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

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

答案 1 :(得分:3)

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

 <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可用。 你可以在这里看到它: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/

答案 2 :(得分:0)

或输入:复选框

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