Question

我有四个选项，如果有人选择一个选项并点击“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>

感谢您的帮助！

如果我能得到解决方案，我将不胜感激

Answer 1

每次点击#nästa元素时，您都会将点击事件处理程序附加到.option，因此将全部触发。附加处理程序一次。单击选项时，将其值存储在变量中并将其放入单击函数中。

代码：

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);
});

演示：http://jsfiddle.net/IrvinDominin/PDc7b/

点击功能反应错误

1 个答案: