Javascript：仅在未查看 Qualtrics 页面时单击“下一步”

Question

背景

我已经使用这篇文章中的 Javascript 和 CSS 在 Qualtrics 中实现了一个倒数计时器（下面的代码）：http://codejaxy.com/q/55868/javascript-timer-qualtrics-qualtrics-progress-to-next-block-when-time-is-up# 我生成的确切代码（它只是实现了该帖子中提出的解决方案）在“ “当前代码”部分。

倒数计时器的代码会在时间到时自动单击“下一步”并前进到新屏幕。它前进到哪个屏幕取决于当前屏幕上每个问题的显示逻辑（参见“当前代码”中的项目 3 和 4）。

问题

虽然这可以成功地将某人移到调查的定时部分的末尾（即，一旦时间到了，您就会从定时部分移到另一个不定时的后续问题集），它即使完成了定时部分，也会导致屏幕前进。换句话说，如果意图是在 Z 时间过去之后将一个人从计时问题集 X 中的任何问题转移到非计时问题集 Y 中的第一个问题，如果一个人回答了 X 中的所有问题 before Z 时间过去了，一个人将从 Y 中的一个问题转移到 Y 中的下一个问题。本质上，一个人最终可能会跳过一个你希望别人回答的问题，而不是跳过计时部分的其余部分。

问题

有没有办法让代码只有在某个问题没有被查看时才点击“下一步”？或者可能到达调查的某个点导致blockTimeFlag = 0并且在时间用完时不会更改？

换句话说，我的目标是不让参与者无法回答不定时的问题块中的问题，因为当参与者已经完成该部分时，屏幕会在计时器指示时间到时自动前进。

当前代码

(1) 在调查外观和感觉中添加了以下自定义 CSS：

 .header-cont {  
   width:100%;  
   position:fixed;  
   top:0px;  
   z-index:1000;  
 }  
 .header {  
   height:75px;  
   background:#FFFFFF;  
   width:100%;  
   margin:0px auto;  
 }  
 .timer{   
   margin: auto;  
   text-align: center;  
   vertical-align: middle;        
   font-size: 200%;
    font-family: Arial;
 }

(2) 创建了一个“计时”问题并在 Javascript 中包含以下内容（注意：这包含了该帖子中提供的解决方案）：

Qualtrics.SurveyEngine.addOnload(function()
{
    var headerCont = document.createElement("div");  
 headerCont.className = "header-cont";  
 headerCont.id = "header_container";  
 var header = document.createElement("div");  
 header.className = "header"  
 header.id = "header_1";  
 var timer = document.createElement("div");  
 timer.className = "timer";  
 timer.id = "timer_1";  
 timer.innerHTML = "Time Remaining: <span id='time'>00:10</span>";  
 headerCont.appendChild(header);  
 header.appendChild(timer);  
 document.body.insertBefore(headerCont, document.body.firstChild);
function startTimer(duration, display) {  
  var timer = duration, minutes, seconds;  
  var myTimer = setInterval(function() {  
   minutes = parseInt(timer / 60, 10)  
   seconds = parseInt(timer % 60, 10);  
   minutes = minutes < 10 ? "0" + minutes : minutes;  
   seconds = seconds < 10 ? "0" + seconds : seconds;  
   var text = ('innerText' in display)? 'innerText' : 'textContent';
   display[text] = minutes + ":" + seconds;  
   if (--timer < 0) {  
    clearInterval(myTimer);  
    timeOver();  
   }  
  }, 1000);  
 }  
 var timerSeconds = 5,  
 display = document.querySelector('#time');  
 startTimer(timerSeconds, display);  
 var timeOver = function() {  
     document.getElementById("timer_1").innerHTML = "Time is up.";
     Qualtrics.SurveyEngine.setEmbeddedData("blockTimeFlag", "1");    
     $('NextButton').click();}



});

(3) 在包含 blockTimeFlag = 0 的计时器之前，在调查流程中创建了一个嵌入式数据字段。

(4) 根据 blockTimeFlag = 0 设置项目的显示逻辑（即如果 blockTimeFlag = 1 - 当时间到时发生 - 则跳过该项目0

Answer 1

我假设您的 JavaScript 在调查页眉或页脚中。如果是这种情况，您可以将代码放在检查嵌入变量值的 if 语句中。这将允许您通过设置嵌入变量的值逐块打开或关闭计时器。

Qualtrics.SurveyEngine.addOnload(function()
{
if("${e://Field/timerOnOff}" == "on"} {    
  var headerCont = document.createElement("div");
  /* the rest of your code here... */
}
}); 

Answer 2

这感觉它有两个解决方案。一个是重新考虑代码的架构，以使这个问题更容易解决，但我会发布我现在想到的快速而肮脏的解决方案。

据我了解，一旦计时器到时，用户就会前进，即使他们已经超过了计时部分，并且一旦设置了计时器，您就无法干预计时器本身。因此，我能想到的最简单的解决方案是：

一旦用户遇到了您所说的第 Y 部分的第一个问题，请更改函数 timeOver()。让它做任何事情，注意不要将它设置为 null，因为它仍然会被调用，然后会抛出错误。

如果您想要一个更...结构化的解决方案，我建议让您的计时器在全球范围内可用（或者更确切地说，据我所知，全球状态并不是一件好事）。然后，您可以在用户进入 Y 部分的第一个问题时立即调用 clearInterval()。