質問

i have made a little quiz:

var allQuestions = {
    question: {
        question0: {
            question: "What is the meaning of HP?",
            choices: ["Hewlett-Pako", "Holy-Packard", "Hewlett-Packard", "Holy-Bigel"],
            correct: "Hewlett-Packard"
        },
        question1: {
            question: "how much is PI?",
            choices: ["2.54", "3.54", "1.21", "3.14"],
            correct: "3.14"
        },
        question2: {
            question: "Who is Messi?",
            choices: ["basketball player", "soccer player", "gold player", "tennis player"],
            correct: "soccer player"
        },
        question3: {
            question: "What is jQuery?",
            choices: ["JS library", "php library", "sql library", "html library"],
            correct: "JS library"
        }
    },

    correctAnswer: 0
};


function set_client() {//this function is to set the client info the first thing that the function does is to look if the text entered in the inputs is valid, next it will see if localstorage has been set already

    //the blur function test to see if the value entered in the inputs are text if it is then it will let you procced if not it wont let you go further more
    $("#fName,#lName").blur(function(){
        //check to see if the the info given is valid if not it will pop up a sentence that alert for wrong info
        var validfn = /[a-zA-Z]/.test($("input[name='fName']").val());// check to match the if the input is a-z char
        var validln = /[a-zA-Z]/.test($("input[name='lName']").val());// check to match the if the input is a-z char
        if (!validfn || !validln) {
            $("#log").append($("#fool").text("First name and last name must be a-z charcters").fadeIn());
            $("#fool").css({"margin-top":"-10px","margin-right":"-20px"});
        }
        else{ //if there the message already exist and the client entered valid text then the message will be dismiss
            $("#fool").fadeOut();
            return validfn;

        }
    }); //end of the blur function

    //checks to see if localStorage is already has vlaue.
    if (localStorage["fn"] == undefined) {
        $("#contain").hide();
        var data;
        //set the first name and last name to localstorage object for future used when clicking "login"
        $("#sublog").click(function () {
            var validfn1 = /[a-zA-Z]/.test($("input[name='fName']").val());// check to match the if the input is a-z char
            var validln1 = /[a-zA-Z]/.test($("input[name='lName']").val());// check to match the if the input is a-z char
            if (!validfn1 || !validln1) {
                //check blur function from above to see what validfn and valid ln does
            }
            else {
                data = { //and object to store the client firstname and lastname
                    first: $("input[name='fName']").val(),
                    last: $("input[name='lName']").val()
                }
                localStorage["fn"] = JSON.stringify(data["first"]);//client first name
                localStorage["ln"] = JSON.stringify(data["last"]);//client last name
            }
        });
    }
    //if there is already a value to localstorage then it means that someone has already logged in. in which this case it will show a welcome message including his first name and last name.
    else {
        $("#log").replaceWith("<h2>welcome : " + JSON.parse(localStorage['fn']) + " " + JSON.parse(localStorage['ln']) + "</h2>");
    }
}


var allquestion = allQuestions["question"];//just a quick way to access the object

var calcAnswers = allQuestions["correctAnswer"];//just a quick way to access the correctAnswer property object

var qNum = 0; //counts the questions up

var value; //undeclared var

var AnsW = [];

//function that display the question and the choices to the section.
function loadquestions(qNum) {
    if (allquestion["question" + qNum] != undefined) {
        $(".question").text(allquestion["question" + qNum]["question"]); //set the the question to the title
        for (var i = 0; i < allquestion["question" + qNum]["choices"].length;) {
            //loops throughout the li's
            var cH = (allquestion["question" + qNum]["choices"][i]); // a var that holds text of choice in poistion i
            $("label[for=li" + i + "]").text(cH); //define for every label its text
            $("#li" + i).attr("value", cH); //define for every input radio its value which is equals to label which is equals to var cH
            i++;//count i with +1
        }
    }
}
//function that fires when clicked the "next" button and when trigered hides the current question and presents the next one
function checkClientChoice() {
    $("#next").click(function () {
        value = $("input[type='radio']:checked").val(); //gets the value of the choosen radio buttons

        if (value == undefined) { //if the value is undefined throw an error and dont proceed to the next question
            $("#fool").fadeIn();
        }
        else {
            $("#back").css({"visibility":"visible"});
            if (allquestion["question" + qNum]["correct"] == value) { //if the value is same as the correct property in the allQuestions object then add +1 to calcAnswers and +1 to qNum and display the next question
                if ($("#fool").css({display: "block"})) {
                    $("#fool").hide();
                }
                $(".question,ul").fadeToggle(0.0000000001);
                calcAnswers++;
                qNum++;
                $(".question,ul").fadeToggle(1000);
                loadquestions(qNum);
            }
            else { //same here. if the value is not undefined but the client choosen answer is not correct then just count qNum up and load the next question but dont count calcAnswer +1
                if ($("#fool").css({display: "block"})) {
                    $("#fool").hide();
                }
                AnsW.push(value);
                $(".question,ul").fadeToggle(0.0000000000001);
                qNum++;
                $(".question,ul").fadeToggle(1000);
                loadquestions(qNum);
            }
        }
        result();
    });
};

function go_back(){
    $("#back").click(function(){
        qNum--;
        loadquestions(qNum);
        if(calcAnswers <= 0){
            calcAnswers = 0;
        }
        else{
            calcAnswers--;
        }
        var tempQuestion =  allquestion["question" + qNum]["question"];
        alert(tempQuestion);
        var tempAns = AnsW[qNum];//user last answer which is false i need this to make the radio button point to that answer
        alert( $("input[value=tempAns]"));
        $("input[value=tempAns]").is("checked",true);
        alert(tempAns);

        var tempAn = AnsW.splice(-1,1);//delete the false answer from the array i need this to make sure that the answer is deleted and there wont be overload of wrong answers
        alert(tempAn);
    });
}


function result() { //checks to see if the are no more questions to display
    if (allquestion["question" + qNum] == undefined) {
        $(".question").text("your Result is: " + calcAnswers + "/" + qNum);
        $("ul,#next,#back").hide();
    }
}

$(document).ready(function () {
    set_client();
    loadquestions(qNum);
    checkClientChoice();
    go_back();
});

I simply want my go_back function to go back and set the previous radio button to be checked by its value. Im not sure that my coding is good so if you want you can also give me a feedback

check my jsfiddle here:http://jsfiddle.net/boazmier/RkQ9P/1/

役に立ちましたか?

解決

You're using .is(), which just returns a boolean indicating if this attribute is set, it doesn't change anything. Probably you should be using .attr() to actually set the value.

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top