jquery - Javascript - Display quiz questions based on URL -


i have simple javascript quiz set on codepen http://codepen.io/anon/pen/dynkjl

it displays 1 question per page , once select answer, move onto next question. whatever answer selected given class "active" can selected answers @ end of quiz.

each answer has data-quizindex of either 1 or 2. when collect "active" answers, can see if answered data-quizindex of 1 (first answer) or vice versa.

anyways, until point, things working great. however, attempting else. user directed quiz via link, , link 1 of following

www.something.com/index.html?qa=0 www.something.com/index.html?qa=1 www.something.com/index.html?qa=2 

the page coming has preview of question 1 can answer. using javascript, need qa value shouldnt problem. if qa 0, quiz starts question 1 , nothing needs done. if qa 1 or 2, quiz should start question 2 , active class question 1 should set li data-quizindex 1 or data-quizindex 2 (depending on ga value).

in other words, if answer question 1 page redirects them quiz, need make question 1 answered within main quiz application.

would possible , if so, best way achieve this?

thanks

you can define querystring property location, e.g:

if (typeof location.querystring === 'undefined') {   object.defineproperty(location, 'querystring', {     get: function() {       return location.search.slice(1).split('&').map(function(i) {         var arr = i.split('=');         var = {};         a[decodeuricomponent(arr[0])] = arr[1] ? decodeuricomponent(arr[1]) : void 0;         return a;       }).reduce(function(a, b) {         var key = object.keys(b)[0];         a[key] = b[key];         return a;       });     }   }); } 

and then, can use when page loaded, this:

$(function() {   var qa = location.querystring['qa'];   if (qa === '1' || qa === '2') {     $('.current .quiz-answer')[qa - 1].click();   } }); 

since want simulate first question answered, better repeating code simulate user has clicked it. take @ updated codepen.

change querystring, , loads again, , you'll see it's working charm! :)


Comments

Popular posts from this blog

1111. appearing after print sequence - php -

java - WARN : org.springframework.web.servlet.PageNotFound - No mapping found for HTTP request with URI [/board/] in DispatcherServlet with name 'appServlet' -

Ruby on Rails, ActiveRecord, Postgres, UTF-8 and ASCII-8BIT encodings -