将单选输入动态添加到 jQuery Mobile 字段集控件组

Question

我已经看到了这个问题的变化，但没有看到我在 SO 上的具体案例，所以就这样吧。

我在使用 jQuery Mobile 将新的单选输入动态添加到现有控制组时遇到问题。它将添加，但样式不正确，并且似乎无法与其他输入正确交互。

这是我的小提琴： http://jsfiddle.net/cjindustries/3mQF6/

谁能看到我做错了什么？或者是重新生成整个字段集/控制组的情况吗？ :(

谢谢！下面的代码也是...

        <div id="testPage" data-role="page">
        <div data-role="content">
    <fieldset data-role="controlgroup">
        <legend>Radio buttons, vertical controlgroup:</legend>
            <input type="radio" name="radio-choice-1" id="radio-choice-1" value="choice-1" checked="checked">
            <label for="radio-choice-1">Cat</label>
            <input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2">
            <label for="radio-choice-2">Dog</label>
            <input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3">
            <label for="radio-choice-3">Hamster</label>
            <input type="radio" name="radio-choice-1" id="radio-choice-4" value="choice-4">
            <label for="radio-choice-4">Lizard</label>
    </fieldset>
        </div>
    </div>

$('<input type="radio" name="radio-choice-5" id="radio-choice-5"><label for="radio-choice-5">Horse</label>')
    .appendTo("fieldset");

$("fieldset").trigger('create');

Answer 1

您需要像上面一样使用name="radio-choice-1"。这解决了你的行为问题

通过以下更改解决了行为问题 用于动态添加收音机的修改代码。

 $('<input type="radio" name="radio-choice-1" id="radio-choice-5"><label for="radio-choice-5">Horse</label>').appendTo("fieldset");

样式问题通过以下更改解决 只需重新创建 div 而不是 fieldset

 $("div").trigger('create');

查看Fiddle Demo