如何循环通过无线电问题返回按钮Javascript
How To Loop Through Radio Questions Back Button Javascript
我正在尝试通过带有'back'和'next'按钮的对象数组进行循环。由于某种原因,它不能正常循环。当"下一个"按钮被按下时,"返回"按钮应该减少每多按一次"下一个"按钮的次数。
这是访问返回按钮以返回单选问题集的函数。要查看完整的代码,请访问我的JS提琴。谢谢!
var questions = {
allQuestions: [
{
topQuestion: [" 1a) Click on which music producer, produced Justins Timberlake 4th Album?", "2a)Click on which famous celebrity did Justin Timberlake date in 1999? ", "3a)Click on which social media movie did Justin Timberlake starred in?", "4a)Click on what famous disney kids show did first Justin Timberlake made his first appearance?", "5a)Click on which famous singer did Justin Timberlake accidently tear clothes off during a performance?", "6a)What magazine named Justin Timberlake the Most Stylish Man In America?"],
question: "1a)What popular site did Justin Timberlake invest 2.2 Million Dollars in? ",
choices: ["Linkedin", "Facebook", "Myspace", "Youtube"],
}, {
question: "2b)Select which movie did Justin Timberlake film score in 2008?",
choices: ["The Incredibles", "Shark Tank", "Finding Memo", "Star Wars"],
correctAnswer: 1
}, {
question: "3b)What city was Justin Timberlake born in?",
choices: ["Chicago", "Detroit", "Tenessee", "New York"],
correctAnswer: 2
}, {
]
};
var newQues = Object.create(questions);
var k = 0;
var chngeRadio = 0;
for (var i = 0; i < 4; i++) {
container = document.getElementById("container");
list = document.getElementById("list");
var li = document.createElement("input");
li.type = 'radio';
li.name = 'radio_group';
li.id = 'id1';
li.value = newQues.allQuestions[i].correctAnswer;
list.style.textAlign = "center";
document.body.appendChild(li);
div = document.createElement("div");
text = document.createTextNode(newQues.allQuestions[0].choices[i]);
list.appendChild(div);
div.appendChild(li);
div.appendChild(text);
}
btn1.onclick = function (event) {
event = EventUtil.getEvent(event);
k++;
while (list.firstChild) {
list.removeChild(list.firstChild);
};
for (var m = 0; m < 4; m++) {
container = document.getElementById("container");
list = document.getElementById("list");
var li = document.createElement("input");
li.type = 'radio';
li.name = 'radio_group';
li.id = 'id1';
li.value = newQues.allQuestions[m].correctAnswer;
list.style.textAlign = "center";
div = document.createElement("div");
text = document.createTextNode(newQues.allQuestions[k].choices[m])
//alert(k);
list.appendChild(div);
div.appendChild(li);
div.appendChild(text);
};
// Assigns a event object to back button, this is where I would like
// to go back and loop the radio questions but for some reason it only decrements 1 time
if ( k >= 1) {
btn2.onclick = function(event){
event = EventUtil.getEvent(event);
chngeRadio++;
function replaceNode() {
function replaceNode() {
if (k === 1) {
//assigns count to 0
chngeRadio -= 1;
};
if (k === 2) {
//assigns count to 1
chngeRadio = 2;
chngeRadio -= 1;
};
};
replaceNode()
while (list.firstChild) {
list.removeChild(list.firstChild);
};
for (var d = 0; d < 4; d++) {
container = document.getElementById("container");
list = document.getElementById("list");
var li2 = document.createElement("input");
li2.type = 'radio';
li2.name = 'radio_group';
li2.id = 'id2';
li2.value = newQues.allQuestions[d].correctAnswer;
li2.style.textAlign = "center";
div2 = document.createElement("div");
text2 = document.createTextNode(newQues.allQuestions[chngeRadio].choices[d])
//alert(k);
list.appendChild(div2);
div2.appendChild(li2);
div2.appendChild(text2);
};
};
};
};
我建议不使用chngeRadio
和replaceNode()
函数,用k--
代替。另外,更改Back btn上的if
条件。单击至k>1
。
if ( k > 1) {
btn2.onclick = function (event) {
event = EventUtil.getEvent(event);
k--;
while (list.firstChild) {
list.removeChild(list.firstChild);
};
for (var d = 0; d < 4; d++) {
container = document.getElementById("container");
list = document.getElementById("list");
…
text2 = document.createTextNode(newQues.allQuestions[k].choices[d]);
//alert(k);
list.appendChild(div2);
div2.appendChild(li2);
div2.appendChild(text2);
};
};
相关文章:
- 在指令控制器中使用$attrs时出现问题
- 将PHP变量传递给jQuery时遇到问题
- Canvas Html5绘图应用程序,移动画布会导致重大问题
- 参数变量出现ngTable指令问题
- 剑道网格jQuery动画()问题
- 我的jQuery插件参数没有正确启动,遇到了问题
- Phonegap-(安卓/iphone)多个图像的图像库出现问题
- TableExport jquery插件:文件名和扩展名问题
- JavaScript Pub/Sub属性访问问题
- JavaScript异步问题
- 如何解决Yii中的页面刷新问题
- Safari(Mac OS)上的jQuery平滑滚动问题
- jqGrid树网格问题
- 使用正则表达式评估电子邮件地址时出现性能问题
- 如何消除代码中的未定义和其他问题
- JavaScript代码问题:我正在将对象转换为数组
- 将事件绑定到Bootstrap 3(button.js)按钮无线电时出现问题
- 如何循环通过无线电问题返回按钮Javascript
- Javascript无线电/复选框问题
- 日光节约时间的无线电日期picker问题