Функция onChange останавливается после одного клика, какой код мне нужно написать, чтобы он продолжался бесконечно? (Javascript) - PullRequest
Новая
       51

Функция onChange останавливается после одного клика, какой код мне нужно написать, чтобы он продолжался бесконечно? (Javascript)

0 голосов
/ 30 апреля 2020 

change = function(event) {
  let new_url;
  if (event.target.value == "views") {
    new_url = "images/desert.jpg";
  } else if (event.target.value == "beaches") {
    new_url = "images/beach-calm.jpg";
  } else if (event.target.value == "party") {
    new_url = "images/plane-wing.jpg";
  }

  let image_two = document.getElementById("image-two");
  if (new_url && image_two.src.indexOf("images/second-main-image.png") != -1) {
    image_two.src = new_url;
  }
}
          <select id="select-one" class="suggestion-dropbox" name="likes" onchange="change(event)">
            <option id="default" value="default"> </option>
            <option id="views" value="views">stunning views</option>
            <option id="beaches" value="beaches">glorious white beaches</option>
            <option id="party" value="party">places to party</option>
          </select>

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

Нужно ли сделать это какое-то время l oop, и если да, то как бы я его структурировал? Спасибо за любую помощь

1 Ответ

0 голосов
/ 30 апреля 2020

Ваше второе определение функции заменяет первое, поэтому вы обновляете изображение только при выборе пляжей.

Вам нужна одна функция, которая проверяет обе опции.

Работает только одна время, потому что вы меняете изображение только тогда, когда оно содержит images/second-main-image.png. После того, как вы выбрали что-то из меню, это больше не так. Вы должны удалить эту проверку.

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

change = function(event) {
  let new_url;
  if (event.target.value == "views") {
    new_url = "images/desert.jpg";
  } else if (event.target.value == "beaches") {
    new_url = "images/beach-calm.jpg";
  } else {
    new_url = ("images/second-main-image.png");
  }

  let image_two = document.getElementById("image-two");
  image_two.src = new_url;
}
<select id="select-one" class="suggestion-dropbox" name="likes" onchange="change(event)">
  <option id="default" value="default"> </option>
  <option id="views" value="views">stunning views</option>
  <option id="beaches" value="beaches">glorious white beaches</option>
  <option id="party" value="party">places to party</option>
</select>

<img id="image-two" src="images/second-main-image.png">
...