в значениях массива не получают вставки или нажмите

Question

У меня есть html с входным каталогом с атрибутами имени comman. Я хотел хранить все данные из входного массива, но он не сохраняется. Я пробовал jQuery push(). Но он сохраняет только первое значение.

HTML

<div id="div-childage"> 
    <input list="childage" name="childage"> 
    <datalist id="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist id="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist id="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist id="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
</div> 

JQuery Я использовал

var childagearray = []; 
$('#div-childage').each(function() { 
    childagearray.push($("input[name='childage']").val()); 
}); 
var childage = JSON.stringify(childagearray); 

выход хотят в целочисленный массив

Answer 1

Вы должны дать каждому DataList уникальный id или всегда будет возвращать первый id

$('button').click(function() { 
 
    var childagearray = []; 
 
    $('input').each(function() { 
 
    childagearray.push($(this).val()); 
 
    }); 
 
    console.log(childagearray) 
 
    var childage = JSON.stringify(childagearray); 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="childage"> 
 
    <input list="childage1" name="childage"> 
 
    <datalist id="childage1"> 
 
     <option value="0" selected> 
 
     <option value="1"> 
 
     <option value="2"> 
 
    </datalist> 
 
    <input list="childage2" name="childage"> 
 
    <datalist id="childage2"> 
 
     <option value="0"> 
 
     <option value="1"> 
 
     <option value="2"> 
 
    </datalist> 
 
    <input list="childage3" name="childage"> 
 
    <datalist id="childage3"> 
 
     <option value="0"> 
 
     <option value="1"> 
 
     <option value="2"> 
 
    </datalist> 
 
    <input list="childage4" name="childage"> 
 
    <datalist id="childage4"> 
 
     <option value="0"> 
 
     <option value="1"> 
 
     <option value="2"> 
 
    </datalist> 
 
</div> 
 

 
<button>Push data</button>

Answer 2

Во-первых, у вас есть несколько элементов с одинаковыми id атрибутом, который является недействительным. Идентификатор должен быть уникальным для документа. Чтобы сгруппировать элементы, преобразовать идентификатор к классам:

<div id="childage-container"> 
    <input list="childage" name="childage"> 
    <datalist class="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist class="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist class="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
    <input list="childage" name="childage"> 
    <datalist class="childage"> 
     <option value="0"> 
     <option value="1"> 
     <option value="2"> 
    </datalist> 
</div> 

Оттуда вы можете использовать map() для создания массива вам нужно:

var childagearray = $('.childage').map(function() { 
    return $(this).val(); 
}).get(); 
var childage = JSON.stringify(childagearray); 

Answer 3

Попробуйте этот код

var childagearray = []; 
$('#div-childage').find('input[name="childage"]').each(function() { 
    childagearray.push($(this).val()); 
}); 
console.log(childagearray); 
var childage = JSON.stringify(childagearray);