JQuery Выберите при изменении кода организации - PullRequest
Новая
       37

JQuery Выберите при изменении кода организации

0 голосов
/ 21 ноября 2019

Я работаю над приложением, в котором на странице есть несколько изображений, которые можно нажимать, и текстовое поле формы, которое можно редактировать, и все они запускают функции Jquery с вызовами Ajax, и все находится в файле JS. Все работает.

Тем не менее, я знаю, что есть другая форма, которая имеет поле SELECT, и я хочу, чтобы он также вызывал вызов функции / Ajax при его изменении. Я даже не могу получить простое предупреждение.

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

Примечание: я могу получить событие onChange наSELECT для запуска при выполнении 'onChange = "alert (" Hello ");'

HTML-код 

            <form name="RankingForm" id="RankingForm">
                <td style="color: white;">
                    <select name="Ranking" id="Ranking" >
                        <option value="4" selected>Open</option>
                        <option value="3" >Advanced</option>
                        <option value="2" >Intermediate</option>
                        <option value="1" >Beginner</option>
                    </select>
                </td>
            </form>

Jquery JS-файл 

$(document).ready(function(){
  var str = this.ID;

  $("input").focusout(function() { 
    $.ajax ({
      WORKING CODE
    })
  });

  $("img").click(function(){
    if (this.id.split('_')[0] == 'Favorite') {
        $.ajax ({
          WORKING CODE
      })
    }
    else if (this.id.split('_')[0] == 'Sent') {
      $.ajax ({
        WORKING CODE
      })
    }
    else if (this.id.split('_')[0] == 'Flash') {
      $.ajax ({
        WORKING CODE
      })
    }
  });
});

$('select[name=Ranking]').on("change", function () {
    alert(this.options[this.selectedIndex].value);
    //NOT WORKING
    alert("Hello");
    //ALSO NOT WORKING
});

Заранее спасибо.

Ответы [ 2 ]

0 голосов
/ 21 ноября 2019

Ни одно из решений для кода не работало для меня, но у Титуса был ответ в тексте его комментариев.

Перемещение этого внутри функции .ready (..) сработало. Я предполагаю, что нужно провести некоторое исследование о наличии независимых функций, а не об одной большой функции.

0 голосов
/ 21 ноября 2019

Да, местоположение неверно, слушатель изменений находится вне функции обратного вызова .ready(..). Вы можете сделать это так, потому что вы устанавливаете слушателя, используя .on(..), но вам придется вызывать .on(..) для объекта, который находится в DOM, когда код выполняется, что-то вроде 

$(document).on('select[name=Ranking]', 'change', function(){
  ..
});
...