Javascript 单击功能反应错误

我有四个选项，如果有人选择一个选项并点击“nästa”，答案应该存储到一个数组中。为了确保该值已被存储，我通知了数组的长度。但如果我点击“Visa alla alternativ”，选择另一个问题，再次点击“nästa”，长度将增加一个

首次尝试：警报将显示1

第二次尝试：警报将显示1，并显示新的警报窗口 节目2

第三次尝试：它将显示1、2、3

为什么会这样

Javascript:

var-answer=[]

$(".option").on("click", click_question);

        function click_question() {


        $(".option").each(function() {
            $(this).fadeTo("slow", 0.1);
            $(this).off("click");
        });



        function store_asnwer() {
            $("#nästa").click(function () {
            answer.push(select); 
            alert(answer.length);

        });
        }

        $(this).fadeTo("slow", 1); 

        $("#nästa").fadeTo("slow", 1);
        $("#visa_alternativ").fadeTo("slow", 1);

        store_asnwer();

        return select = $(this).text();
        }

        $("#visa_alternativ").on("click", function () {
            $(".option").each(function() {
                $(this).fadeTo("slow", 1);
                $(this).on("click", click_question);
            });

            answer.splice(0,1);

            $(this).fadeTo("slow", 0.2);
        });
HTML: 


<div class="option" id="option_1"> Svars alternativ_1 </div>
<div class="option" id="option_2"> Svars alternativ_2 </div>                            <div class="option" id="option_3"> Svars alternativ_3 </div>
<div class="option" id="option_4"> Svars alternativ_4 </div>

<div class="question_nästa" id="nästa"> Nästa </div>
<div class="question_nästa" id="tillbaka_question"> Tillbaka </div>
<div class="question_nästa" id="visa_alternativ"> Visa alla alternativ </div>   

$（.option”）。单击（“单击”，单击问题）；
函数单击_问题（）{
$（“.option”）。每个（函数（）{
美元（本）。法代托（“缓慢”，0.1）；
$（此）.off（“单击”）；
});
函数存储\u asnwer（）{
$（“#nästa”）。单击（函数（）{
回答。按（选择）；
警报（回答长度）；
});
}
美元（这一点）。法代托（“慢”，1）；
$（“nästa”）.fadeTo（“慢”，1）；
美元（“#visa_alternativ”）。法德托（“慢”，1）；
store_asnwer（）；
return select=$（this.text（）；
}
美元（“#visa#U alternativ”）。在（“单击”，功能（）{
$（“.option”）。每个（函数（）{
美元（这一点）。法代托（“慢”，1）；
$（此）。在（“单击”，单击问题）；
});
答案：拼接（0,1）；
美元（本）。法代托（“缓慢”，0.2）；
});
HTML:
Svars alternativ_1
Svars备选方案2 Svars备选方案3
Svars备选方案4
纳斯塔
蒂尔巴卡
阿拉交替签证

谢谢你的帮助

---

如果我能得到解决方案，我将不胜感激。在每次单击

.option

元素时，您都会向

#nästa

附加一个单击事件处理程序，因此将全部触发。连接处理程序一次。单击某个选项时，将其值存储在变量中，并将其插入单击函数中

代码：

---

演示：

通常情况下，当您开始在事件处理程序和循环等内部添加事件处理程序时，会发生这种情况，每次都会添加一个新的事件处理程序，而且它一直在堆积。发布一个容易跟踪错误的提琴。我如何避免像您所说的每次添加处理程序。哦，所以我不应该使用“nästa”.click函数进入click_question（）？不，在这种情况下，您将在每次选项单击时附加一个click处理程序，您将面临问题，但我已经更改了更改，并且它正在工作，但我之所以将“nästa”放入“nästa”。在click_问题中单击是为了使“nästa”按钮只起作用，我的意思是，一旦我们选择了一个选项，就可以点击。。如何使单击功能仅在单击选项时工作？

var answer = [];
var selected;

$(".option").on("click", click_question);

$("#nästa").click(function () {
    answer.push(selected);
    alert(answer.length);
});

function click_question() {

    $(".option").each(function () {
        $(this).fadeTo("slow", 0.1);
        $(this).off("click");
    });

    $(this).fadeTo("slow", 1);

    $("#nästa").fadeTo("slow", 1);
    $("#visa_alternativ").fadeTo("slow", 1);

    selected = $(this).text();
}

$("#visa_alternativ").on("click", function () {
    $(".option").each(function () {
        $(this).fadeTo("slow", 1);
        $(this).on("click", click_question);
    });

    answer.splice(0, 1);

    $(this).fadeTo("slow", 0.2);
});