###前提・実現したいこと
ここでご協力をいただいて、下記のようなセレクトボタンを選択したらその数だけ<input>を追加するプログラムを作りました。
このプログラムで入力欄に入力した値を取得したいのですが、どうすればいいかわからなくて困っています。
for文をまわしてみたのですがうまくいきません。
どなたか教えていただけないでしょうか?
よろしくお願いします。
###ソースコード
html
1<!DOCTYPE HTML> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <link rel="stylesheet" href="components/loader.css"> 8 <link rel="stylesheet" href="css/style.css"> 9 <link href="css/bootstrap.min.css" rel="stylesheet"> 10 <script src="components/loader.js"></script> 11 <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script> 12 <script src="js/bootstrap.min.js"></script> 13 <script> 14</head> 15<body> 16<form> 17 <select id="select_number"></select> 18 <li id="list_name"> 19 <input type="text" id="name1" /> 20 </li> 21</form> 22<div class="btn"> 23 <button type="button" id="btn" class="btn btn-primary btn-lg">ボタン</button> 24</div><br /> 25</body> 26</html> 27
JavaScript
1$(function(){ 2 $(function(){ 3 //select_numberに<option>を追加 4 for(var i = 0; i < 50; i++){ 5 $('<option value="' + ( i + 1 ) + '">' + (i + 1) + '</option>').appendTo("#select_number"); 6 } 7 }); 8 //select_numberを選んだときの動作 9 $("#select_number").on("change", function(){ 10 var select_number = $("#select_number").val(); 11 $("#list_name").empty(); 12 //list_nameに<input>を追加 13 for(var i = 0; i < select_number; i++){ 14 $('<input type="text" id="name' + i + '" />').appendTo("#list_name"); 15 } 16 }).empty(); 17 18 //ボタンを押したときの動作 19 $(".btn>#btn").on("click", function(){ 20 //変数の設定 21 var select_number = $("#select_number").val(); 22 for(var i = 0; i < select_number; i++){ 23 $('var list_name' + i + ' = $("#list_name' + i + '").val;') 24 } 25 }); 26 27});
###補足情報(言語/FW/ツール等のバージョンなど)
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。