0

Всем привет, не так давно я начал изучать JavaScript и столкнулся с трудностью в решении задачи. В моем JS-скрипте я отправляю значение, выбранное в абзац с классом .selected_index_value пока все хорошо, но задача сейчас в другом, не отправлять значение только первому найденному абзацу, а всем существующим на странице с таким же идентификатором. Если у вас есть идеи, как это делается, пожалуйста, помогите мне.

Мой код и все проверенные варианты:

  1. getElementsByClassName
    document.getElementById('item1').onchange = function(){ 
        document.getElementsByClassName('selected_index_value')[0].innerHTML = this.options[this.selectedIndex].innerHTML; 
    }
    <select id="item1" name="Item 1">
          <option></option>
          <option value="1">1</option>
          <option value="2">2</option>
          <option value="3">3</option>
        </select>
    <p class="selected_index_value"></p>
    <p class="selected_index_value"></p>

2.querySelector

document.getElementById('item1').onchange = function(){
    document.querySelector(".selected_index_value").innerHTML = this.options[this.selectedIndex].innerHTML;        
}
<select id="item1" name="Item 1">
      <option></option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
    </select>
<p class="selected_index_value"></p>
<p class="selected_index_value"></p>

Пока только так но с document.getElementById() не пробовал а то знаю что не получится, и еше если я удалю выше индекс 0 getElementsByClassName()[0] то вообше не работает.

Фрагмент также размещен на codepen Codepen.com

1 ответ 1

0

Так нужно?

document.getElementById('item1').onchange = function () {

  const collection = document.querySelectorAll('.selected_index_value');
  for (const item of collection) {
    item.innerHTML = this.options[this.selectedIndex].innerHTML;
  }

}
<select id="item1" name="Item 1">
  <option></option>
  <option value="1">1</option>
  <option value="2">2</option>
  <option value="3">3</option>
</select>

<p class="selected_index_value"></p>
<p class="selected_index_value"></p>

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.