Создание викторины с одной страницей, которая определяет результат (нет доступа к базе данных или php, должен быть в javascript / html / etc.) - PullRequest
0 голосов
/ 28 марта 2012

Примечание. У меня нет доступа к базе данных и я не могу использовать PHP, поэтому я и прошу помощи. Мои руки связаны, и я могу сделать только через html / javascript / и т. Д.

Я создаю онлайн-викторину, которая состоит из 10 вопросов (1 вопрос на страницу), но только один вопрос определяет результат для 4 различных окончательных местоположений. Вопрос 3 (стр. 3) является определяющим вопросом, но мне нужно «записать» выбор переключателя, поэтому последний вопрос (стр. 10) определяет URL для кнопки отправки, которая перенаправляет пользователя.

Все остальные вопросы - вопросы тщеславия, так как вопрос 3 является большим определяющим фактором.

Я думал, что ответ на вопрос 3 (стр. 3) создает файл cookie с значениями 1 из 4 (в зависимости от выбора переключателя), затем на последнем вопросе (стр. 10) файл cookie читается и значение определяет URL, который затем записывает в коде перенаправления URL для кнопки отправки. Сейчас это просто теория, так как я не уверен, выполнимо ли это.

Любой совет будет принят с благодарностью.

Ответы [ 4 ]

1 голос
/ 28 марта 2012

Я вижу по крайней мере еще 2 способа сделать это:

Использовать iFrame:

Сохранить скрытый ввод за пределами iFrame.Этот вход записывает ответы.Сценарий iFrame должен добавить ответ (разделенный запятыми или любой другой) к скрытому вводу в родительском элементе при отправке вопроса.После этого в iFrame загружается новая страница.Когда последний вопрос встречается, сценарий iFrame может обновить и прочитать родительский ввод, затем определить, какой URL-адрес следует загрузить, а затем загрузить URL-адрес в местоположение родительского документа.

Использовать jQuery Ajax: ИЗМЕНЕНО, чтобы удалить скрытый ввод, который здесь не нужен:

Используя jQuery Ajax, вы можете загрузить следующий вопрос в основной div, а также сохранить значения ответов, которые вы хотите в скрипте jQuery.

РЕДАКТИРОВАТЬ: Вот еще один способ, используя CSS и javascript / jQuery:

Загрузить все вопросы на ОДНОЙ странице.Но только текущий вопрос имеет style = 'display: block;', остальные должны иметь style = 'display: none'.Когда на вопрос дан ответ, используйте javascript или jQuery для записи ответов в переменную.В вашем случае кажется, что вас интересует только один ответ, так что это еще проще.Затем используйте ваш скрипт для изменения атрибутов отображения в зависимости от того, какой вопрос должен отображаться.Наконец, если задан последний вопрос, вы можете определить URL и загрузить следующую страницу.

КАК ПОЛУЧИТЬ ПАРАМЕТР ИЗ СТРОКИ ЗАПРОСА:

function getQuery(key_str) {
// return value of key_str variables query string of url
// Example: url = "index.html?answer=5"; if key_str = "answer" then it returns "5"
  if(window.location.search) {
    var query = window.location.search.substr(1);
    var pairs = query.split("&");
    for(var i = 0; i < pairs.length; i++) {
      var pair = pairs[i].split("=");
      if(unescape(pair[0]) == key_str) return unescape(pair[1]);
    }
    return null;
  }
}

function go() {
  var answer = getQuery(answer);
  var durl = "http://www.defaulturl.com";
  switch (answer) {
    case '1' : url = "http://www.url1.com"; break;
    case '2' : url = "http://www.url2.com"; break; 
    case '3' : url = "http://www.url3.com"; break;
    default  : url = durl;
  }
  window.location.href = url;
  return false;
}

<input type="button" value="Submit" name="butt" onclick="return go();">
0 голосов
/ 28 марта 2012

Ваш метод cookie будет работать нормально. Также возможно с HTML5 local storage. Но я должен спросить ... если вы нигде не записываете результаты остальных 9 вопросов, какой смысл их задавать? :)

0 голосов
/ 28 марта 2012

Я бы сделал все, что мог, чтобы избежать cookie-файлов, и просто оставил бы тест на одной странице ... Я знаю, что вы говорите, что у вас нет доступа к бэкенду, но я просто хотел добавить это.

Вы можете заставить пользователя чувствовать, что это действительно 10 "страниц", но ваш JS будет обмениваться "страницами" и сохранять значения формы при загрузке одной страницы. Подумайте об элементе с вкладками DOM с 10 вкладками.

Полностью согласен с Алексом, что локальное хранилище HTML5 тоже будет работать.

0 голосов
/ 28 марта 2012

Почему бы вам не передать соответствующий ответ как GET?Вы можете легко прочитать строку запроса в Javascript.

...