Вывод нескольких значений атрибутов value и data в разные html теги

Question

Есть поле

<select id="carsField">
<option value="HH EU2548" title="HH EU2548" data-img="6.png">Octavia</option>
</select>

скрипт выводит значение атрибута value в

<span id="CARNUMBER"></span>
<script>
    test.call(carsField)
    carsField.addEventListener('change', test)
    function test() {
        CARNUMBER.textContent = this.value;
    }
</script>

Как можно изменить скрипт, чтобы он еще дополнительно подставлял значение атрибута "data-img" в src тега img ?

<img id="CARIMAGE" src="" width="100" height="100">

Answer 1

Как можно изменить скрипт, чтобы он еще дополнительно подставлял значение атрибута "data-img" в src тега img ?

Такое можно реализовать, например, вот так...

test.call(carsField)
carsField.addEventListener('change', test)

function test() {
  CARNUMBER.textContent = this.value;
  CARIMAGE.src = 'folderimg/' + this.options[this.selectedIndex].dataset.img;
}

<select id="carsField">
  <option value="HH EU2548" title="HH EU2548" data-img="6.png">Octavia</option>
</select>
<span id="CARNUMBER"></span>
<img id="CARIMAGE" src="" width="100" height="100">

БЛОГ НА HUSL

Вывод нескольких значений атрибутов value и data в разные html теги

Ответы (1 шт):