动态添加元素从jquery或javascript

Question

如果用户输入一个输入说3到文本框三个小文本框应该显示在下面或通过JavaScript或jQuery的弹出。如何做到这一点...

<input type="text" name="order">3</input> 

谢谢..

Answer 1

记住你应该掩盖文本框只允许数字条目......或者，也许用一个下拉列表，用数字来防止错误的列表。但here是一个很好的jQuery蒙板插件来防止非数字条目。

<input type="text" name="Order" onKeyDown="checkVal(this)">3</input> 

<div id="myDiv"> 
</div> 


function checkVal(ctrl){ 
    var val = ctrl.value; 
    $('myDiv').html(''); // remove existing elements 
    for (i=0;i<parseInt(val,10);i++){ 
     $('#myDiv').append('<input type="text" />'); 
    } 
} 

Answer 2

给这个<input/>“秩序”的ID，那么它的那样简单：

var order = $('#order'), 
    container = $('<div/>').insertAfter(order); 

order.keyup(function(){ 
    container.html(
     Array(Math.abs(~~this.value) + 1).join('<input/>') 
    ); 
}); 

仅供参考，~~（双位操作不）具有获得的任何数量表示的效果键入（使用内部toInt32操作），然后对其进行铺设。 E.g：

~~'2'; // => 2 
~~'2.333'; // => 2 
~~null; // => 0 

而且Math.abs是为了防止负值，如果传递给Array()将抛出一个错误。

DEMO：http://jsbin.com/azexa4