我在使用 jquery mobile 时遇到了一些严重问题,正在构建一个学习响应系统。现在我想在每次有问题需要回答时动态填充问题页面。到目前为止,我已经能够做到所有这些,但目前,当我动态调用它们时,我的单选按钮拒绝遵循正常的 jquery 顺序。当我动态调用时,设计会中断,但是当我对其进行硬编码时,我得到的正是所期望的。下图是 wat am 试图解释的示例。上面的扭曲单选按钮是动态的,下面的 2 个是硬编码的。
这是我使用的代码:
var possibleAnswers=poss_ans.split(",");//poss_ans is string containing all the answer from the database
for (var i =0; i < possibleAnswers.length; i++) {
var label = sp[i];
$radio = $('<input />', { type: "radio" });
var $label = $('<label />', { text: label});
var wrapper = $('<div />');
wrapper.append($label).append($radio);;
$('div#poss_ans').append(wrapper);
}
请这是我的 html,很抱歉,但我不太擅长 fiddle ,这就是为什么我没有在那里发布。
<fieldset class="ui-grid-b">
<h1 id="title">H1 Heading</h1>
<p id="question">The question</p>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<div id="poss_ans"></div>
<input type="radio" name="radio-choice-1" id="radio-choice-2" value="choice-2" />
<label for="radio-choice-2">6</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">4</label>
<input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">8</label><input type="radio" name="radio-choice-1" id="radio-choice-3" value="choice-3" />
<label for="radio-choice-3">2</label>
</fieldset>
</div>
</div>
任何帮助或贡献都将不胜感激。谢谢
最佳答案
测试您的代码并输入默认值字符串并将该值添加到动态创建的 radio 后,我可以确认它工作正常。我想你的问题是你的 HTML 的主要部分有问题。但由于你还没有添加,我无法确认。
这是您的 JavaScript 代码:
var poss_ans = "6,4,8,2";
var possibleAnswers = poss_ans.split(","); //poss_ans is string containing all the answer from the database
for (var i = 0; i < possibleAnswers.length; i++) {
var label = possibleAnswers[i];
$radio = $('<input />', {
type: "radio",
value: possibleAnswers[i],
});
var $label = $('<label />', {
text: label
});
var wrapper = $('<div />');
wrapper.append($label).append($radio);
$('div#poss_ans').append(wrapper);
}
并且使用了 HTML:
<div id="poss_ans"></div>
最后,一个工作 fiddle - http://jsfiddle.net/andyjh07/tw0k5qkc/
关于javascript - 动态添加单选按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29098263/