控制组在动态添加单选按钮- jQuery移动后失去控制

Question

我的控制组(jQueryMobile1.4)在最初动态创建无线电组时呈现得很好，但是当我向它添加另一个收音机时，按钮会被样式化，但会分开。当我重新加载应用程序时，他们又在一起了。

function showPlaces() {    
    $('#radio-group').empty();

    for(var i = 0; i < connections.length; i++) {
        $('#radio-group').append('<label><input type="radio" name="places" id="' + i + '" />' + place + '</label>');           
    }

    $('input[type=radio]').checkboxradio().trigger('create');
    $('#radio-group').controlgroup().trigger('create');
}

//函数在应用程序启动时调用，并在我添加另一个位置之后再次调用

我尝试过的其他一些事情：

$("#radio-group").controlgroup("refresh");                                          
$('#radio-group').controlgroup('refresh');
$("[data-role=controlgroup]").controlgroup("refresh");
$('input[type=radio]').checkboxradio('refresh');

也尝试了.controlgroup(‘容器’)，在.append之前，但是get“在初始化之前不能调用控件组上的方法”。

下面是html：

<form>  
    <fieldset data-role="controlgroup" id="radio-group">
        <!-- Dynamically injected radio buttons go here -->
    </fieldset>
</form> 

Answer 1

您应该在for循环中将.append()项放入.controlgroup("container")中，然后增强单选按钮.checkboxradio()。

for(var i = 0; i < connections.length; i++) {
  $('#radio-group')
      .controlgroup("container")
      .append('<label><input type="radio" name="places" id="+i+" />Place</label>');           
}

$("#radio-group")
    .enhanceWithin()
    .controlgroup("refresh");

您甚至不需要使用.checkboxradio()，而是在父容器上使用.enhanceWithin()。

演示