Как вызвать событие начального изменения для переключателей с помощью jquery?

Я пытаюсь включить / отключить "другое" поле в нижней части набора переключателей, вот так...

window.init = function() {
  debugger;
  var form = $("#myform");
  var enableOther = function() {
    var other = $(this).val() == 'other';
    form.find('input[name=other]').prop('disabled', !other);
  };
  var options = form.find('input:radio[name=myradio]');
  options.change(enableOther);

  //now I want to call the on-change handler to update the initial disabled value
  $.proxy(enableOther, options)(); //these don't work
  //options.trigger('change');
  //options.triggerHandler('change');
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button onclick="debugger; init();">Init</button>

<form id="myform">
  <ul>
    <li><input type="radio" name="myradio" value="1" />Item 1</li>
    <li><input type="radio" name="myradio" value="2" />Item 2</li>
    <li><input type="radio" name="myradio" value="3" />Item 3</li>
    <li><input type="radio" name="myradio" value="other" />Other</li>
    <li><input type="text" name="other" /></li>
  </ul>
</form>

(нажмите "Инициализация", выберите "Другой", снова нажмите "Инициализация", и поле по ошибке станет недоступным)

Это хорошо работает при нажатии на каждый элемент, но я хочу иметь возможность .change() Триггер обратного вызова jquery один раз в функции init (этот фрагмент переходит во всплывающую форму с постоянными значениями). я пробовал .proxy а также trigger, но я, кажется, получаю все радио кнопки и .val() это индивидуальное значение, а не выбранное.

Как я должен искусственно вызывать этот обратный вызов?

1 ответ

Решение

Радио кнопки странные.

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

var myval = $('input[type="radio"][name="myradio"]:checked').val();
var other = myval == 'other';

Примечание: использовать [type="radio"] не :radio поскольку это позволяет селектору быть более эффективным, когда браузеры поддерживают это.

Тест: чтобы доказать концепцию, установите ДРУГОЕ до вызова init:

$('input[type="radio"][name="myradio"]').eq(3).prop('checked',true);

а затем тот, который не является:

$('input[type="radio"][name="myradio"]').eq(2).prop('checked',true);

Затем используйте то, что вы пытались:

options.trigger('change');
Другие вопросы по тегам