2

Я только изучаю JQ, но делаю это на рабочем задании: нужно забацать некий тест.

Есть около 30 вопросов по 4 варианта ответа.

При клике мышки по варианту ответа публикуется новый вопрос со своим набором вариантов.

Вопросы эти и варианты ответов было предложено загнать в объекты (один JS объект "вопросы", в котором множество свойств "вопросN" ...., в которых хранятся значения - варианты ответов "вар1", "вар2", "вар3", "вар4" (для каждого вопроса, т.е. массивы), ... ну и название самого вопроса "вопрос N") и мне нужно запрограммировать смену текста вопросов после выбора варианта ответа.

Т.е. мне нужно будет извлекать данные из этих массивов (объектов) и размещать их в дивах.

В общем, меня интересует НЕ решение задачи (самому нужно разобраться), а вот именно механизм, синтаксис работы JQ с объектами JS.

1
  • 2
    А зачем вам вообще работать с объектами js при помощи jQuery? Размещайте данные в дивах при помощи jQuery если хотите, а данные для размещения доставайте javascript'ом.
    – yolosora
    Commented 26 февр. 2018 в 9:28

2 ответа 2

2

Вот пример заполнения данных на странице взятых из js объекта с использованием jquery.

var question = {
  title: 'Ваши интересы',
  options: ['Программирование', 'Чтениe', 'Пьянки']
}
$('.question').text(question.title);
$('.answer').each(function(index) {
  $(this).prepend(question.options[index]);
});
label {
  display: block;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <label class='question'></label>
  <label class='answer'><input type="checkbox"></label>
  <label class='answer'><input type="checkbox"></label>
  <label class='answer'><input type="checkbox"></label>
</div>

5
  • @fromillia в данном случае имеется ввиду класс указанный в html (в первом label).
    – yolosora
    Commented 26 февр. 2018 в 9:54
  • Да я уже сообразил и ответ отредактировал ) Поспешил
    – fromillia
    Commented 26 февр. 2018 в 9:55
  • @fromillia если получили ответ на вопрос - не забывайте отметить вопрос как решенный, в противном случае конкретизируйте вопрос!
    – yolosora
    Commented 26 февр. 2018 в 10:00
  • Вот что-то не найду функционала из серии "отметить вопрос как решённый". Может кто подскажет, где тут заветная кнопка ?!
    – fromillia
    Commented 26 февр. 2018 в 10:03
  • @fromillia галочка слева от ответа который считаете наиболее подходящим (ответ можно выбрать только один0
    – yolosora
    Commented 26 февр. 2018 в 10:07
1

А нет по сути никакого дополнительного механизма для работы с объектами в jquery, все делает чистый js. Единственное, что можно использовать функцию each, которая может перебирать объекты, но обращение к свойствам объекта всё равно стандартное, ничего дополнительно в jq для этого нет

var quests = {
  "вопрос1":{
    "1": "1_1",
    "2": "1_2",
    "3": "1_2",
  }, 
  "вопрос2":{
    "1": "2_1",
    "2": "2_2",
    "3": "2_2",
  },
  "вопрос3":{
    "1": "3_1",
    "2": "3_2",
    "3": "3_2",
  },
}

var questNum = 0,
    currentQuest;

function nextQuest(){

  questNum++;

  currentQuest = quests['вопрос' + questNum];

  $('#quest').html('вопрос ' + questNum)

  for(key in currentQuest) {
    $('#quest').append('<div class="ansv">'+currentQuest[key]+'</div>')
  }

}

nextQuest();

$('#quest').on('click', function(){
  nextQuest();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="quest">
</div>

1
  • Пример заточен под клик по вопросу, а надо было кликать по ответам. Вот сейчас думаю, как это реализовать.
    – fromillia
    Commented 26 февр. 2018 в 11:45

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.