HTML выбор с помощью тега select

Question

есть задача:

...сделать выбор названия картинки с помощью тега "select"

Вот часть кода, в котором нужно сделать изменение:

<select name = "picture">
            <option>winter.jpg</option>
            <option>spring.jpg</option>
            <option>fall.jpg</option>
            <option>summer.jpg</option>
        </select>
        <img src = "${picture}" name = "myimage">

я уже пробовал передать через $

<img src = "${picture}" name = "myimage"

но не работает... не выбирает картинку.

Answer 1

$('#picture-name').change(function() {
    console.log($(this).find("option:selected").text());
    $('#picture').attr('src', $(this).find("option:selected").text())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<select name="picture" id="picture-name">
  <option>winter.jpg</option>
  <option>spring.jpg</option>
  <option>fall.jpg</option>
  <option>summer.jpg</option>
</select>
<img src="${picture}" name="myimage" id="picture">

let select = document.querySelector('#picture-name');

select.addEventListener('change', (event) => {
  console.log(event.target.value); 
  document.querySelector('#picture').setAttribute('src', event.target.value);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
<select name="picture" id="picture-name">
  <option>winter.jpg</option>
  <option>spring.jpg</option>
  <option>fall.jpg</option>
  <option>summer.jpg</option>
</select>
<img src="${picture}" name="myimage" id="picture">

БЛОГ НА HUSL

HTML выбор с помощью тега select

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