关于在Qualtrics中实现文件上传页面循环跳转的技术咨询
关于在Qualtrics中实现文件上传页面循环跳转的技术咨询
我完全懂你要做的这个动态文件上传流程——让用户可以反复上传文件、添加备注,直到他们主动选择停止,对吧?确实Qualtrics自带的Loop & Merge是预设循环次数的,没法灵活适配这种用户触发的动态循环,分支功能也搞不定这种跳回当前页的逻辑,那咱们就用JavaScript来实现,步骤其实挺清晰的:
第一步:先准备基础的追踪字段和页面内容
- 首先在Survey Flow里添加一个嵌入式数据字段,命名为
uploadCount,初始值设为1——这个字段用来记录当前是第几次上传,咱们要靠它来更新页面上的“1st”“2nd”这类提示文字。 - 在你的目标页面里,把需要显示序数的文本(比如“第X个文件上传”)用Qualtrics的管道文本绑定这个字段,比如写成:
第${e://Field/uploadCount}个文件上传;如果是英文场景,先绑定数字,后面用JS处理序数词转换。 - 确保页面里的三个问题都配置好:文件上传题、文本评论题、“是否继续上传”的选择题(选项设为“是”和“否”)。
第二步:编写JavaScript控制按钮行为
在目标页面的设置里找到JavaScript选项卡,把下面的代码粘贴进去(记得把代码里的QID替换成你实际的问题ID,比如Q3是“是否继续上传”的问题):
// 监听下一页按钮的点击事件 document.getElementById('NextButton').addEventListener('click', function(e) { // 阻止默认的下一页跳转行为 e.preventDefault(); // 获取用户是否选择继续上传的答案 const continueChoice = Qualtrics.SurveyEngine.getQuestionData('Q3').choice; // 读取当前的上传次数 let currentCount = parseInt(Qualtrics.SurveyEngine.getEmbeddedData('uploadCount')); if (continueChoice === 'Yes') { // 如果用户选择继续:更新计数并重置页面 currentCount++; // 把更新后的计数存回嵌入式数据 Qualtrics.SurveyEngine.setEmbeddedData('uploadCount', currentCount); // 更新页面上的序数提示文本(提前给提示文本元素加好class "upload-ordinal-label") const labelElement = document.querySelector('.upload-ordinal-label'); if (labelElement) { // 这里如果是英文场景,可以用序数词转换函数,后面会补充 labelElement.textContent = `第${currentCount}个文件上传`; } // 重置三个问题的内容 // 重置文件上传框 const uploadInput = document.querySelector('#QID1-upload input[type="file"]'); if (uploadInput) uploadInput.value = ''; // 重置评论文本框 const commentInput = document.querySelector('#QID2 input[type="text"], #QID2 textarea'); if (commentInput) commentInput.value = ''; // 重置是否继续的选项 Qualtrics.SurveyEngine.getQuestion('Q3').clearResponse(); // 留在当前页面,无需跳转 } else { // 如果用户选择不继续:执行正常的下一页跳转 Qualtrics.SurveyEngine.navClick(e, 'NextButton'); } });
第三步:补充细节调整
如果你需要显示英文序数词(1st/2nd/3rd),可以在JS里加一个转换函数:
// 数字转英文序数词的小工具函数 function getEnglishOrdinal(num) { const suffixes = ["th", "st", "nd", "rd"]; const remainder = num % 100; return num + (suffixes[(remainder - 20) % 10] || suffixes[remainder] || suffixes[0]); }然后把更新文本的代码改成:
labelElement.textContent =${getEnglishOrdinal(currentCount)} File Upload``一定要给页面上的序数提示元素手动添加
upload-ordinal-label这个class,不然JS找不到要修改的内容。测试时注意:嵌入式数据的更新是会话级的,测试时要完整走流程,不要中途刷新页面,避免计数丢失。
其实核心就是用嵌入式数据追踪上传次数,用JS拦截下一页按钮的默认行为,根据用户选择动态决定是重置页面继续还是正常跳转。之前你试的Loop & Merge是预先定死循环次数的,确实不适合这种用户自主决定停止的场景,用JS就能完全灵活控制啦。
备注:内容来源于stack exchange,提问作者YXC
相关产品推荐
相关产品推荐

