Javascript for Qualtrics

Javascript for Qualtrics

本文关键字：Qualtrics for Javascript      更新时间：2024-06-02

我需要一些Javascript方面的帮助。我想在Qualtrics上显示两张图像，但要延迟5秒。

为了更清楚，Image2应该在Image1显示5秒后显示。

Qualtrics.SurveyEngine.addOnload(function()    
{    
    /*Place Your Javascript Below This Line*/    
});​

您实际上不需要Javascript就可以做到这一点。在Qualtrics中，您可以添加一个"计时"问题，使参与者在5秒后自动前进。方法如下：

  1. 插入要显示的第一张图像
  2. 添加时间问题（将右侧的自动提前选项设置为"5"，持续5秒）
  3. 在时间问题后插入分页符
  4. 在分页符后插入要显示的第二个图像

这样就可以了。如果您还有任何问题，请访问support@qualtrics.com

感谢您使用Qualtrics。在Facebook和Twitter上分享爱@qualtrics

-Qualtrics团队

这是Qualtrics网站上计时器的修改：

http://www.qualtrics.com/university/researchsuite/coders-corner/html-and-css#displaytimer

几个注意事项：

  1. 我不确定你是否想让第一张照片消失第二个出现了，但这是你会遇到的行为此JavaScript
  2. 我离开倒计时只是为了说明定时以及图像的出现和消失
  3. 以防万一，事情还不完全清楚。我使用的图像代码必须替换为您从自己的Qualtrics图像中获得的链接图书馆所以img src="https://yourorghere.qualtrics.com/CP..."会被任何东西取代您在Qualtrics的组织url是

这是CSS：

.pic2 {
 display: none;
}​

图像1:

这是html:

Time: <span id="time1">30</span><br>
<img src="https://yourorghere.qualtrics.com/CP/Graphic.php?IM=IM_bCpAC12YW14vbtq" style="width: 133px; height: 115px;" class='pic1' />

添加此javascript以替换默认的Qualtrics javascript:

started = false;
function countDown1() {
  if (!started)
    started = true;
  else {
    var value1 = parseInt($('time1').innerHTML);
    $('time1').innerHTML = value1 - 1;
    if (value1 == 26) {
      var styling1 = document.getElementsByClassName('pic1')[0];
      styling1.style.display = "none";
    }
  }
  setTimeout(countDown1, 1000);
}
Event.observe(window, 'load', countDown1);​

图像2:

这是html:

Time: <span id="time2">30</span><br>
<img src="https://yourorghere.qualtrics.com/CP/Graphic.php?IM=IM_4Vjre9FrrbA828s" style="width: 117px; height: 107px;" class='pic2' />

替代默认Qualtrics JavaScript:的JavaScript

started = false;
function countDown2() {
    if (!started)
        started = true;
    else {
        var value2 = parseInt($('time2').innerHTML);
        $('time2').innerHTML = value2 - 1;
        if (value2 == 25) {
            var styling2 = document.getElementsByClassName('pic2')[0];
            styling2.style.display = "block";
        }
    }
    setTimeout(countDown2, 1000);
}
Event.observe(window, 'load', countDown2);
相关文章：