在Jquery/Javascript中的Array中插入Textbox值

Insert Textbox values in Array in Jquery / Javascript

本文关键字:插入 Textbox Array 中的 Jquery Javascript      更新时间:2023-09-26

我有一个文本框,用户可以在其中逐个添加一些值。现在,当用户单击添加按钮时,我希望将用户输入的值逐个插入到数组中。我在这么做,但我得到了错误的结果。数组的长度没有增加。假设如果我输入了2个值,那么数组的长度保持为1。我不知道出了什么错。以下是我的代码:-

HTML

<input type="text" class="form-control input_add_prod_grp" name="input_add_prod_grp" placeholder="Enter Group Name" />
<button class="btn default btn-xs btn_add_input_prod_grp" name="btn_add_input_prod_grp" id="add_group">Add</button>

Javascript

$(".btn_add_input_prod_grp").click(function(){
var add_input_grp = $("input[name$='input_add_prod_grp']").val();
var newArray = [];
newArray.push('Ungrouped');
$( "input[name='input_add_prod_grp']" ).each(function() {
    newArray.push($( this ).val());
});
console.log(newArray.length);
}); 

现在,若我输入的值超过1,那个么数组的长度保持为1。我不知道为什么。。请帮帮我。。提前谢谢。。

带你走出阵列:

var newArray = [];
$(".btn_add_input_prod_grp").click(function(){
   var add_input_grp = $("input[name$='input_add_prod_grp']").val();

  newArray.push(add_input_grp);
  console.log(newArray.length);
}); 

JSFIDDLE:https://jsfiddle.net/c19u6fa2/1/

var newArray = [];
$(".btn_add_input_prod_grp").click(function() {
  var add_input_grp = $("input[name$='input_add_prod_grp']").val();
  newArray.push('Ungrouped');
  $("input[name='input_add_prod_grp']").each(function() {
    newArray.push($(this).val());
  });
  console.log(newArray);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" class="form-control input_add_prod_grp" name="input_add_prod_grp" placeholder="Enter Group Name" />
<button class="btn default btn-xs btn_add_input_prod_grp" name="btn_add_input_prod_grp" id="add_group">Add</button>

将初始化置于click事件之外。在内部单击事件中,它总是一次又一次地重新初始化。

当您点击按钮时,您将newArray设为空,因此旧值将从该数组中删除以避免这种情况发生。您必须将其与默认值一起移动到函数之外。您只有一个输入框,无需编写每个输入框。您可以直接从变量中获得该值

            var newArray = ['Ungrouped'];
            $(".btn_add_input_prod_grp").click(function(){
                var add_input_grp = $("input[name$='input_add_prod_grp']").val();
                newArray.push(add_input_grp);
                console.log(newArray.length);
            });