2

我有一份半功能问卷。最初会出现一个问题，下面有答案，当点击一个答案时，它会被记录下来并在下面显示给用户。

我现在需要帮助来获得它，以便当问题 1 的答案被击中时，问题 2 的图像及其相关答案会出现在问题 1 及其可能答案的位置。

我已经在这里http://jsfiddle.net/QV5EB/上传了jsfiddle上的全部内容，我四处寻找类似的事件，我发现这段编码似乎与我正在寻找的内容相关，只是它基于标题我没有在我的代码中使用。

self.selectQuestion = function(answer) {
    self.progress.push({
        question: questions[currentQuestionIndex].caption,
        answer: answer.caption
    });

任何人都可以推荐一种特定的方法吗？

4

1 回答 1

2

这应该很容易 - 为图片和每个答案设置 ID，然后使用它document.getElementById()来抓取每个元素。

对于图片，将其.src属性更改为新图片的 URL。

对于答案，将其.innerHTML属性更改为新答案的值。

您的 HTML 可能如下所示：

<img src='whatever.jpg' id='pic'>
<label id='answer1'><input type='radio' name='answer' value='dog'> Dog</label>
<label id='answer2'><input type='radio' name='answer' value='pig'> Pig</label>
<label id='answer3'><input type='radio' name='answer' value='snake'> Snake</label>

然后，您的 JS 可能如下所示：

document.getElementById('pic').src = 'newpic.jpg';
document.getElementById('answer1').innerHTML = '<input type='radio' name='answer' value='rooster'>Rooster';

等等

没有.innerHTMLDOM 函数有一种更优雅的方法。对这些进行一些研究，它们既有趣又强大。特别是，上面的 JS 可能采用以下形式

var rad = document.createElement('input');
rad.type = 'radio';
rad.name = 'answer';
rad.value = 'rooster';

...也许span为文本插入一个，但这有点过头了。也许innerHTML是最好的。:)

于 2013-06-10T00:36:04.827 回答