Получить значения всех input одинаковым class jquery

191

18 марта 2022, 03:30

Подскажите пожалуйста, как получить значения всех input с одинаковым классом в переменную в формате 1, 2, 3, 4

function inp_val() { 
  var values = $(".inp_val").val(); 
  alert(values); 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<input type="number" class="inp_val" value="1"> 
<input type="number" class="inp_val" value="2"> 
<input type="number" class="inp_val" value="3"> 
<input type="number" class="inp_val" value="4"> 
<input type="button" value="click" onclick="inp_val();">

Answer 1

используйте map(), get() и join()

$("button").click(function(){ 
  const values = $(".inp_val").map( (i,el) => $(el).val() ).get().join(','); 
  console.log(values); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<input type="number" class="inp_val" value="1"> 
<input type="number" class="inp_val" value="2"> 
<input type="number" class="inp_val" value="3"> 
<input type="number" class="inp_val" value="4"> 
<button>click</button>

Answer 2

Вам нужно "пройтись" по всем элементам с классом .inp_val

Используйте .each(), подробнее здесь

function inp_val() { 
  var str = ''; 
  var count = $(".inp_val").length; 
  var i = 1; 
  $(".inp_val").each(function(){ 
    str += parseInt($(this).val()); 
    if (i != count) { 
        str += ", "; 
    } 
    i++; 
  }); 
  console.log(str); 
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 
<input type="number" class="inp_val" value="1"> 
<input type="number" class="inp_val" value="2"> 
<input type="number" class="inp_val" value="3"> 
<input type="number" class="inp_val" value="4"> 
<input type="button" value="click" onclick="inp_val();">