Textboxの値をJquery/Javascriptの配列に挿入します。

Question

私は、ユーザーが値を1つずつ追加できるテキストボックスを持っています。今、ユーザーが追加ボタンをクリックすると、ユーザーが配列に1つずつ入力する値を挿入したいと思います。私はこれをやっているが、間違った結果を得ている。配列の長さは増加していません。私が2つの値を入力した場合、配列の長さは1のままです。何がエラーなのか分かりません。その後、配列の長さは1。私がいないまま、私は1つの以上の値を入力した場合、今

<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); 
}); 

HTML - ：以下は私のコードです理由を知ってください。私を助けてください..事前に感謝..

Answer 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/

Answer 2

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>

クリックイベントの外で初期化を入れてください。クリックイベントの中では、常に何度も何度も再初期化されます。

Answer 3

ボタンをクリックしたときに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); 

      });