jquery - 我们如何从 Jquery 的输入字段中获取计数值或行数？

Question

当我在输入字段中输入数字时，它将反映文本框，即我在文本框中输入的数字将在下面显示一个文本框。

如果我输入数字为 2 表示将显示 2 文本框。

我想要 Jquery keyup 中的输出，所以请为此提供解决方案。

代码：

<div class="col-md-4">
    <div class="form-group padd-bottom">
       <label><h6 class="centerlized">Members : </h6></label>
    </div>
</div>
<div class="col-md-4">
    <div class="form-group padd-bottom">
        <input type="text" name="members" class="form-control eachmem" id="members" placeholder="Members">
    </div>
</div>

标签： jquery

Answer 1

这是您正在寻找的 jquery 解决方案。

在这里，我们从输入字段中获取计数值，然后运行一个for...循环将输入添加到 dom。

每次更改输入时，都会清除 dom，然后运行循环以添加输入。

var $ = jQuery;
$('#input_count').on('keyup', function(){
  var count = $(this).val();
  var container = $('#form_container');  
  var el = `</br><input name="member[]" placeholder="element value" type="text"/>`;
  if(count){
    container.empty();
    for(var i = 0; i< count; i++){
      container.append(el);
    }  
  }else{
    container.empty();
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<input type="text" id="input_count" placeholder="element count" />

<div id="form_container">

</div>