如何使用jquery触发单选按钮的初始更改事件？

Question

我正在尝试启用/禁用一组单选按钮底部的“其他”字段，如此...

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>

（单击Init，选择Other，再次单击Init，该字段将被错误地禁用）

单击每个项目时，这样可以正常工作，但我希望能够在init函数中使用.change() jquery回调触发器一次（此剪切将进入具有持久值的弹出窗体）。我已经尝试了.proxy和trigger，但我似乎得到了所有单选按钮，而.val()是单个值，而不是所选的值。

我应该如何人为地触发此回调？

Answer 1

单选按钮很奇怪。

在你的回调中，使用选中的选择器。

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

注意：使用[type="radio"]而不是:radio，因为它允许选择器在浏览器支持时更有效率。

测试：为了证明这个概念，在调用init之前设置OTHER：

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

然后是那个不是：

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

然后使用您尝试的内容：

options.trigger('change');