Как получить все атрибуты данных из входных данных в массив в Javascript?

У меня есть ряд входных данных, которые мне нужны для создания автоматического массива, если пользователь вводит, но когда я печатаю, он добавляет несколько элементов в массив.

Мне нужен такой результат

["10", "20", "30", "40", "50"]

но это происходит так, если я снова наберу

["10", "20", "30", "40", "50", "40", "30", "30", "30", "20"]

Как добавить только один раз при вводе?

const $input = document.querySelectorAll("input")

var items = [];

$input.forEach(item => {
  item.addEventListener('input', () => {

    boxdata = item.getAttribute('data-valor')
    items.push(boxdata);

    console.info(items);
  })
})

item 1: <input type = "text"  data-valor = "10"> 
item 2: <input type = "text"  data-valor = "20">
item 3: <input type = "text"  data-valor = "30">
item 4: <input type = "text"  data-valor = "40">
item 5: <input type = "text"  data-valor = "50">

Хорошо, что происходит, когда значение ввода изменяется, оно запускает вашу функцию forEach.

— 29.06.2019 20:25

а) используйте Set б) зачем вам нужно генерировать массив, когда пользователь вводит? Значение data-valor не меняется, не так ли?

— 29.06.2019 20:30

javascript arrays

29.06.2019 20:18

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Попробуйте с Задавать вот так:

const $input = document.querySelectorAll("input")

const items = new Set();

$input.forEach(item => {
  item.addEventListener('input', () => {

    boxdata = item.getAttribute('data-valor')
    items.add(boxdata);

    console.info([...items]);
  })
})

item 1: <input type = "text" data-valor = "10"> 
item 2: <input type = "text" data-valor = "20"> 
item 3: <input type = "text" data-valor = "30"> 
item 4: <input type = "text" data-valor = "40"> 
item 5: <input type = "text" data-valor = "50">

29.06.2019 23:37

Другие вопросы по теме

Печатать символы строки или массива в C Fast

Найти первую фотографию в каждом альбоме внутри массива фотографий с помощью AlbumIds

Как я могу объединить два целочисленных массива в C с циклами for

Сортировать многомерный массив с двумя массивами внутри?

Счетчик отображаемых изображений

Невозможно нажать() элементы (после первой итерации) в Javascript

Поиск изображения в группе изображений

Swift: создать произвольную базовую строку из массива байтов

PHP: почему значение изменяется, если нет назначения?

Как получить доступ даже к элементам массива в bash

Как получить все атрибуты данных из входных данных в массив в Javascript?

Ответы 1

Другие вопросы по теме

Похожие вопросы