Как перенести функцию .change из jQuery в обычный Javascript

Question

Я не эксперт по JS, но я думаю, что я пытаюсь сделать это довольно просто (по крайней мере, в jQuery)

У меня есть 3 выбора

  <select id="faq" class="onchance_fill">...</select>
  <select id="pages" class="onchance_fill">...</select>
  <select id="faq" class="onchance_fill">...</select>

и вход (это крошечный MCE в плагине advlink)

<input type="text" onchange="selectByValue(this.form,'linklisthref',this.value);" value="" class="mceFocus" name="href" id="href" style="width: 260px;">

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

В Jquery это было бы что-то вроде:

$('.ajax_onchance_fill').change(function() {
        data = $('.ajax_onchance_fill').val();
        $('#href').text(data);
    });

Но я не могу это использовать. Так что же такое эквивалент в простом Javascript?

Спасибо

Answer 1

Попробуйте это:

$('.ajax_onchance_fill').change(function() {
        var data = $(this).val();
        $('#mytextboxid').val(data);
    });

Answer 2

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

 <script type="text/javascript">
  function load() {
  var elements = document.getElementsByClassName('onchance_fill');
  for(e in elements){
      elements[e].onchange = function(){
          document.getElementById('href').value = this.value;
     }       
  }
  }
</script>

Answer 3

document.getElementsByClassName("ajax_onchance_fill").onchange = function() { 
   getElementById('href').value = this.options[this.selectedIndex].text;
};

Хотя я точно не уверен, сработает ли это, поскольку getElementsByClassName возвращает более 1 элемента.