JQuery 带有单选按钮的可折叠移动设备

JQuery Mobile collapsible with radio buttons

我尝试创建一种替代方法来选择一组选项，例如在 select 小部件中。

我的自定义 select 是用一个可折叠按钮和一组单选按钮构建的，它们比 JQM select 稍微轻一些，因为非本地 select 菜单被转换成弹出窗口或对话框。尤其是在面板内使用时，而且对我来说数据绑定更容易。

我正在将标记动态地插入面板内部。该面板还可以有不同的内容，这些内容将在 panel.onbeforeopen 中初始化。 现在，只有在创建可折叠对象后，我才能绑定单选按钮更改事件。我尝试过类似的方法但不起作用：

$("#collapsible-select").on("collapsiblecreate", function(event, ui) {
  $("#radio-choice-1").change(function() {
    var label = $("label[for='" + $(this).attr('id') + "']");
    $("#collapsible-select").collapsible("option", "collapseCueText", label);
    $("#collapsible-select").collapsible("collapse");
  });
});

手风琴初始化后，如何在正确的时间绑定单选按钮更改事件？ 是否还有一种方法可以将整个单选按钮的更改事件绑定到每个单选按钮？

新 笨蛋：http://plnkr.co/edit/OSocuRPQIzuk367dE6XS?p=preview

使用页面的pagecreate事件添加change handler，使用name属性只添加一个handler:

$(document).on("pagecreate","#one", function(){ 
  $('[name="radio-choice"]').change(function(e) {
    var label = $(this).parent(".ui-radio").find("label").text();
    $("#collapsible-select").collapsible("option", "collapseCueText", label).collapsible( "collapse" );
  });
});

已更新Plunker