Как зарегистрировать хук onblur для select_tag?

Question

В настоящее время у меня есть этот тег с множественным выбором, который вызывает функцию каждый раз, когда что-то выбирается / отменяется. Но я хочу, чтобы функция вызывалась, когда пользователь щелкает из раскрывающегося списка select_tag, какие-нибудь идеи?

<%= select_tag ... :onchange => 'handleChange()' %>

Answer 1

Есть несколько способов.

Лучший способ выполнить sh это с помощью ненавязчивого JavaScript. Добавьте прослушиватель событий следующим образом:

  # <%= select_tag 'state' ... ' %> =>

  <select name="state" id="state" multiple>
    <option value="MN">Minnesota</option>
    <option value="IA">Iowa</option>
    <option value="WI">Wisconsin</option>
    <option value="SD">South Dakota</option>
  </select>
  
  <script>
    let element = document.getElementById('state');
    element.addEventListener('blur', event => console.log("blur, baby, blur"));
  </script>

Если вы предпочитаете нам jQuery и он уже импортирован, вы можете использовать его обработчики событий. Версия jQuery будет go примерно так:

$(document).on('blur', '#state', event => console.log('blur, baby, blur'));

Обратите внимание, что передача события вашей функции не является обязательной. Я добавляю обработчик событий непосредственно в документ, что означает, что он будет работать, даже если элемент select динамически добавляется на страницу после загрузки страницы.

В качестве альтернативы вы можете использовать этот more classi c jQuery подход, если вы не загружаете элемент динамически.

$('#element-id').on('blur', function() {
  // do stuff
}