Как получить все значения одного класса в JQuery? - PullRequest
Новая
       8

Как получить все значения одного класса в JQuery?

0 голосов
/ 22 сентября 2019

Я пытаюсь получить все значения полей ввода класса.но возвращается только одно значение поля

HTML-код 

<div id="mydiv">
<input class="seconds" type="text" value="40">
<input class="seconds" type="text" value="20">
<span class="countdown"></span>
</div>

Javascript code 

<script src="{{ asset('js/vendor/jquery-3.1.0.min.js') }}"></script>
<script src="{{ asset('js/jquery.missofis-countdown.js') }}"></script>


<script>

var ek=$('.seconds').val();

console.log(ek);
$( '.countdown' ).countdown( {
  from: ek, // 3 minutes (3*60)
  to: 0, // stop at zero
  movingUnit: 1000, // 1000 for 1 second increment/decrements
  timerEnd: undefined,
  outputPattern: '$day Day $hour : $minute : $second',
  autostart: true,
});
</script>

Я хочу получить значения обоих полей ввода, имеющих один и тот же класс

Ответы [ 2 ]

1 голос
/ 22 сентября 2019

Используйте map() для создания массива значений 

var ek = $('.seconds').map((_,el) => el.value).get()

console.log(ek)
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="mydiv">
<input class="seconds" type="text" value="40">
<input class="seconds" type="text" value="20">
<span class="countdown"></span>
</div>
0 голосов
/ 22 сентября 2019

Методы атрибутов будут получать только значение первого элемента.

Чтобы получить кратное число, вы должны выполнить итерацию (цикл) для каждого элемента, возвращаемого селектором. 

var ek=[];
$('.seconds').each(function() { ek.push($(this).val()); });
console.log(ek);

Таймеры:

Убедитесь, что вы добавили как можно большеОбратный отсчет занимает столько времени, сколько вы хотите, чтобы таймеры в вашем html. 

$( '.countdown' ).each(function(index) { 
$(this).countdown( { from: ek[index], // 
3 minutes (3*60) 
to: 0, // stop at zero
 movingUnit: 1000, // 1000 for 1 second increment/decrements
 timerEnd: undefined, 
outputPattern: '$day Day $hour : $minute : $second',
 autostart: true, });
    });

Примечание : Я прошу прощения за форматирование.Я на мобильном телефоне.

...