Блог

если пользователь вводит, скажем, 3 в текстовое поле, три небольших текстовых поля должны быть показаны ниже или во всплывающем окне через javascript или jquery.Как это можно сделать…

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

Спасибо..

Дайте <input/> идентификатор «order», тогда это так просто, как:

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

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

К вашему сведению, ~~ (дважды побитовое-нет) приводит к получению числового представления любого типа (с использованием внутренней toInt32 операции) и последующему заполнению его. Например:

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

И Math.abs предназначен для защиты от отрицательных значений, которые при передаче в Array() выдадут ошибку.

ДЕМОНСТРАЦИЯ: http://jsbin.com/azexa4

Имейте в виду, что вам, вероятно, следует замаскировать текстовое поле, чтобы разрешить ввод только числовых данных…Или, возможно, используйте выпадающий список со списком чисел, чтобы предотвратить ошибку. Но здесь есть отличный плагин jquery mask для предотвращения нечисловых записей.

 <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" />');
   }
}