Qualtrics调查JS：滑块拖动显示下按钮/5秒自动跳转问题排查

• 逻辑只在addOnload页面加载阶段执行一次，滑块拖动是加载完成后的用户操作，根本触发不到写的if (mouseDown)判断，自然不会显示按钮
• 全局绑定mousedown/mouseup事件没有针对性，点击页面任意位置都会改变计数，不是只有滑块操作才会触发
• 5秒自动跳转的逻辑没有中断机制，哪怕用户提前完成滑块操作，到时间还是会强制跳页，不符合需求

将对应题目下的自定义JS整体替换为以下代码即可：

Qualtrics.SurveyEngine.addOnload(function() {
    const currentQuestion = this;
    // 页面加载后先隐藏下一页按钮
    currentQuestion.hideNextButton();
    // 标记是否已完成滑块作答，避免重复触发逻辑
    let isAnswered = false;
    // 存储自动跳转定时器ID，用于后续清除
    let autoJumpTimer = null;

    // 启动5秒无操作自动跳转逻辑
    autoJumpTimer = setTimeout(function() {
        if (!isAnswered) {
            currentQuestion.clickNextButton();
        }
    }, 5000);

    // 监听当前题目内的滑块值变化，Qualtrics原生滑块拖动完成、值更新时会触发change事件
    currentQuestion.questionContainer.addEventListener('change', function(e) {
        // 校验触发源是滑块输入控件，且未标记为已作答
        if (e.target.classList.contains('slider-input') && !isAnswered) {
            isAnswered = true;
            // 清除自动跳转定时器，避免强制跳页
            clearTimeout(autoJumpTimer);
            // 显示下一页按钮
            currentQuestion.showNextButton();
        }
    });
});

Qualtrics.SurveyEngine.addOnReady(function() {
    // 页面完全渲染后无额外逻辑，留空即可
});

Qualtrics.SurveyEngine.addOnUnload(function() {
    // 页面卸载时无额外逻辑，留空即可
});

• 不需要自行实现鼠标按下、拖动、松开的全流程监听，直接绑定Qualtrics原生控件的变更事件即可，只有用户真实拖动滑块修改答案才会触发按钮显示，不会误判页面其他位置的点击操作
• 交互状态标记可以避免重复执行按钮显示、跳转逻辑，减少异常概率
• 用户完成滑块操作后会立刻清除自动跳转定时器，不会出现答完题还被强制跳页的问题
• 所有逻辑都绑定在当前题目上下文下，不会污染全局事件，也不会影响问卷其他页面、其他题目的正常运行

内容的提问来源于stack exchange，提问作者Emma