在Qualtrics中修改JavaScript日历

Question

我找到了一个JavaScript代码来嵌入一个Qualtrics问题的日历。

Enter a survey date:
<link href="https://cdn.jsdelivr.net/npm/pikaday/css/pikaday.css" rel="stylesheet" type="text/css" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/moment.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.6.1/pikaday.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.2/locale/es.js"></script>

<script>
Qualtrics.SurveyEngine.addOnload(function()
{
var inputId = 'QR~' + this.questionId;
moment.locale('en');

var picker = new Pikaday(
        {
        field: document.getElementById(inputId),
        i18n: {
            previousMonth : 'previous month',
            nextMonth     : 'next month',
            months        : moment.localeData()._months,
            weekdays      : moment.localeData()._weekdays,
            weekdaysShort : moment.localeData()._weekdaysShort
        },
        minDate: new Date(2020, 05, 22),
        maxDate: new Date(2020, 05, 26),
        yearRange: [2000, 2020],
        bound: true,
        container: document.getElementById('container')       
    });
});
Qualtrics.SurveyEngine.addOnReady(function()
{
jQuery("#"+this.questionId+" .InputText").attr("readonly",true);

});
</script>

它在第一页上运行良好。然而，日历仍然出现在Qualtrics调查问卷第二页的左角。我應該如何修改上述程式碼，使日曆只出現在第一頁的日期問題上？

另外，我发现 "new Date(2020, 05, 22) "中的 "5 "是6月(不是5月)的。我想可能是Javascript中第一个数字为0的逻辑所致。我应该如何修改代码来显示与实际月份相匹配的月号？

Answer 1

你把脚本放在哪里？ 链接和脚本标签应该放在调查表头。 然后在问题的JavaScript中使用addOnload和addOnReady函数（而不是在问题文本中的脚本标签中）。

是的，在该日期格式中，月份是从0开始索引的。您可以使用一个带有实际日期的日期字符串，如 "2020-05-22"。

就个人而言，我喜欢用flatpickr作为Qualtrics的日期选择器。