javascript - 当选择其他时如何隐藏当前下拉列表下方的div - qualtrics

Question

我正在尝试使用自定义 JS 在 Qualtrics 中进行一项调查，以便问题 1 有一个包含多个选项的下拉列表，最后一个是“其他”，我正在尝试这样做，以便当问题 1 有 '其他人选择的问题2将隐藏并且不再显示。我已经预览了调查并获取了 div 元素和下拉列表的 ID，如下所示:

下拉菜单 ID = QR~QID12 我要隐藏的div ID = QID119

我一直在尝试使用下面的代码，但尚未使其工作

Qualtrics.SurveyEngine.addOnload(function ()
{
    this.questionclick = function(event,element){

         if (this.getTextValue() == 'Others'){
           $('QID119').show();
           alert('show');
         } else if (this.getTextValue() != 'Others'&&this.getTextValue() != '')  {
            $('QID119').hide();
            alert('hide');
        }
    }

});

我尝试过 this.getTextValue() 以及 $("QR~QID12").getValue() 但似乎都没有隐藏其下面的 div。

Answer 1

一些事情:(1)问题不是选择，因此您的代码正在查看错误的元素(this.questionclick)； (2) 问题也不是一个选择 (this.getTextValue)，因此您的代码再次查看了错误的元素； (3) 对于选择来说，单击处理程序不是一个好的选择。此外，您的代码执行与您编写的内容相反的显示/隐藏。最后，最好避免使用固定的 QID 代码。

尝试以下操作。我猜你想要你为显示/隐藏而写的内容，但如果不是，只需更改条件:

Qualtrics.SurveyEngine.addOnload(function ()
{
    var nq = $(this.questionId).next('.QuestionOuter');     //next question
    var select = $(this.questionId).down('select');         //select element
    hideShow(select);   //initialize to support prev button
    select.on('change', function() {
            hideShow(this); 
    });

    function hideShow(selEl) {
        var selText = selEl.options[selEl.selectedIndex].text;
        if (selText == 'Others' || selText == '') nq.hide();
        else nq.show();
        selEl.blur();
    }

});