Как отформатировать внедренные данные Qualtrics для каждого входа?

Question

Я пытаюсь получить некоторые встроенные данные и вывести их определенным образом (цвет, положение и т. Д.). Например, мы помещаем внедренные данные как <div class="previous">$e://Field/DTBEG}</div> в тексте вопроса, но я хочу взять его и вставить прямо под полем ввода (я не думаю, что мы можем сделать это непосредственно в Qualtrics, поэтому здесь нужен собственный JS).

Итак, в тексте вопроса у меня есть:

<div>1a. Reporting Period: Beginning</div>
<div class="previous date">${e://Field/DTBEG}</div>

где DTBEG данные могут быть пустыми или могут содержать 5/6 цифр, представляющих дату. Заголовок опроса имеет:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script>
    var $j = jQuery.noConflict();
</script>

как объяснено в их документации.

Итак, в jQuery я могу получить доступ к предыдущим данным поля с $j(".previous"), но проблема в том, что Qualtrics на самом деле ставит 2 (или больше, в зависимости от типа вопроса) <div class="previous date"></div> поля в моем вопросе. Сейчас это очень вводит в заблуждение, потому что у каждого встроенного элемента данных могут быть дополнительные "предыдущие" элементы div, поэтому я не могу определить, были ли встроенные данные просто пустыми или это дублирующее поле.

...
<h2 class="noStyle">
    <label class="QuestionText BorderColor">
        <div>1b. Reporting Period: End</div>
        <div class="previous date">33113</div> <!-- first instance of the div, this seems to be visible -->
    </label>
</h2>
<fieldset>
    <div class="QuestionBody">
        <table class="ChoiceStructure" border="0" cellpadding="0" cellspacing="0" summary=" 1b.&amp;nbsp; Reporting Period:&amp;nbsp; End&amp;nbsp; 33113 " style="width:710px">
        <caption class="QuestionText BorderColor">
            <div>1b. Reporting Period: End</div>
            <div class="previous date">33113</div> <!-- second instance of the div, this seems to be hidden -->
        </caption>
        ...
    </div>
</fieldset
...

Есть ли лучший способ выполнить то, что я пытаюсь сделать? Я прекрасно пишу свой собственный JS для этого, но пока, потому что HTML-вывод Qualtrics не совсем то, что я ожидал, я сталкиваюсь с проблемами.

Answer 1

Попробуйте следующий javascript в необходимом вопросе:

Qualtrics.SurveyEngine.addOnload(function()
{

$$('.QuestionBody')[0].insert($$('.previous')[0]);

});

Вместо того, чтобы использовать jQuery и сталкиваться с этой проблемой, здесь используется запеченный в PrototypeJS. Селектор

$$('.class')

вернет массив элементов. Поскольку в вашем "предыдущем" классе есть и должен быть только 1 элемент, это первый и единственный элемент в массиве. Число, выбранное для массива ".QuestionBody", необходимо будет скорректировать в зависимости от количества вопросов на странице и того, где они будут отображаться.

Также стоит отметить, что

$('idName') 

может использоваться для выбора элемента с идентификатором и не возвращает массив.