2016-12-08 10 views
3

名前が同じで、値が異なる同じクラスのテキストフィールドが多数あり、各入力には1つのボタンがあります。それぞれの特定のボタンをクリックして、各フィールドから値を取得します。 Javascriptで使用する。そして私は配列にその値を入れることができますが、配列はマージされません。最初のボタンをクリックすると、特定の入力フィールドの値が配列に入れられます.3番目のボタンをクリックすると、配列の最初の値が削除され、新しいvlaue(3番目の行の値)が配列に格納されます。どのように私は各クリックボタン上の同じ配列内のすべての値を格納することができます。異なる入力値から配列をマージする方法。

ここに私のコードです。ここで

<div> 
    <input type="hidden" name="myvalue" class="form-control input_text" value="aaa"/> 
    <input type="button" class="clickme" value="Get Value" /> 
</div> 

<div> 
    <input type="hidden" name="myvalue" class="form-control input_text" value="bbb"/> 
    <input type="button" class="clickme" value="Get Value" /> 
</div> 

<div> 
    <input type="hidden" name="myvalue" class="form-control input_text" value="ccc"/> 
    <input type="button" class="clickme" value="Get Value" /> 
</div> 

<div> 
    <input type="hidden" name="myvalue" class="form-control input_text" value="ddd"/> 
    <input type="button" class="clickme" value="Get Value" /> 
</div> 

<div> 
    <input type="hidden" name="myvalue" class="form-control input_text" value="eee"/> 
    <input type="button" class="clickme" value="Get Value" /> 
</div> 

は、あなたがこれだけ current valuearray

var array_id = []; 
$(document).ready(function() { 
    $(".clickme").click(function() { 
    var div = $(this).closest('div'); 
    var get_eupdid = div.find('input').val(); 
    alert(get_eupdid); 

    //Push the value into array. 
     array_id.push(get_eupdid); 

     console.log("array_id: " + array_id); 
    }); 
}); 

答えて

1

に残るあなたはbuttonがクリックされるたびにarray作成している今、配列global.Rightを行う必要があり、私のjavascriptの

<script type="text/javascript"> 
//Get the value on button click 
    var div = $(this).closest('div'); 
    var get_eupdid = div.find('input').val(); 

    alert(get_eupdid); 

    //Push the value into array. 
    var array_id = []; 

    array_id.push(get_eupdid); 

    console.log("array_id: " + array_id); 
</script> 
0

ですお試しください:ここにない機能をクリックしてと宣言してくださいグローバル

var array_id = []; 
 
$('.clickme').click(function(){ 
 
    var get_eupdid= $(this).closest('div').find('input').val(); 
 
    array_id.push(get_eupdid); 
 
    console.log("array_id: " + array_id); 
 
    }) 
 
    
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <input type="hidden" name="myvalue" class="form-control input_text" value="aaa"/> 
 
    <input type="button" class="clickme" value="Get Value" /> 
 
</div> 
 

 
<div> 
 
    <input type="hidden" name="myvalue" class="form-control input_text" value="bbb"/> 
 
    <input type="button" class="clickme" value="Get Value" /> 
 
</div> 
 

 
<div> 
 
    <input type="hidden" name="myvalue" class="form-control input_text" value="ccc"/> 
 
    <input type="button" class="clickme" value="Get Value" /> 
 
</div> 
 

 
<div> 
 
    <input type="hidden" name="myvalue" class="form-control input_text" value="ddd"/> 
 
    <input type="button" class="clickme" value="Get Value" /> 
 
</div> 
 

 
<div> 
 
    <input type="hidden" name="myvalue" class="form-control input_text" value="eee"/> 
 
    <input type="button" class="clickme" value="Get Value" /> 
 
</div>

1

ように私はあなたがこれをチェックすべきだと思います。他のものを使ってデータを保存することができる場合、通常は<input type='hidden' />の必要はありません。また、CSSのほんの少しで、<div>に何か他のものを入れたいのでないかぎり、どのようにできるのかを示しています。

$(function(){ 
 

 
var possible = ['aaa', 'bbb', 'ccc', 'ddd', 'eee'], collection = []; 
 
$('.clickme').each(function(i, e){ 
 
    $(e).click(function(){ 
 
     collection.push(possible[i]); 
 
     console.log(collection); 
 
    }); 
 
}); 
 

 
});
.clickme{ 
 
    display:block; 
 
}
<head> 
 
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js'></script> 
 
</head> 
 
<body> 
 
    <div> 
 
    <input type='button' class='clickme' value='Get Value' /> 
 
    <input type='button' class='clickme' value='Get Value' /> 
 
    <input type='button' class='clickme' value='Get Value' /> 
 
    <input type='button' class='clickme' value='Get Value' /> 
 
    <input type='button' class='clickme' value='Get Value' /> 
 
    </div> 
 
</body>

関連する問題