Javascript 根据问题1显示特定分区/答案

我正在使用jquery selectbox，并尝试获取第一个问题，以确定显示在问题集末尾的链接。如果用户选择第一个答案，他们将被引导到第一个链接，如果他们选择答案2，然后是第二个链接，以此类推

<div class="step question">
    <h2>Select An Answer</h2>
    <div id="q1_one" class="button button_green next">Answer 1</div>
    <div id="q1_two" class="button button_red next">Answer 2</div>
    <div id="q1_three" class="button button_red next">Answer 3</div>
</div>

选择一个答案
答复1
答复2
答复3

下面是我试图展示的一组答案。目前，无论问题1中选择了什么答案，它们都会显示出来，我只是想为每个选项显示正确的答案：

<div id="if_one">
    <a href="http://websitelinkhere.com/1" class="button_primary agree">If Question 1 = Answer 1</a>
</div>
<div id="if_two">
    <a href="http://websitelinkhere.com/2" class="button_primary agree">If Question 1 = Answer 2</a>
</div>
<div id="if_three">
    <a href="http://websitelinkhere.com/3" class="button_primary agree">If Question 1 = Answer 3</a>
</div>

---

这里显示的是

在翻阅代码之后，问题是您没有存储/显示您的答案，您只是在显示所有内容。这是我如何破解的。我建议你想出一个更好的策略

全小提琴：

在第616行附近，我添加了答案的全局存储，并在答案输入时进行记录：

document.storedAnswers = [];


$('.next, .agree').click(function () {

    next = false;
    if ($(this).hasClass('agree')) {
        button_type = 'agree';
    } else {
        button_type = 'next';
        document.storedAnswers.push(this.id);
    }
    //.... rest of code
}

最后，在“验证”之后，我修改了您的超时：

setTimeout(function () {

    jQuery('.verify_container .loader').hide();
    //This line showed all answers... we want to be more selective.
    //jQuery('.verify_container .button_primary').css('display', 'block');
    var answerToShow = '';
    switch(document.storedAnswers[0]) {
        case 'q1_one': {
            answerToShow = 'if_one';
            break;
        }
        case 'q1_two': {
            answerToShow = 'if_two';
            break;
        }
        default: {
            answerToShow = 'if_three';
            break;
        }           
    }

    if (answerToShow.length > 0) {
        $('#' + answerToShow + ' .button_primary').css('display', 'block');
    }

}, 1000);

---

我现在看不到它们中的任何一个显示在您的JSFIDLE上。你能更新你的小提琴，让它像你说的那样吗？