Qualtrics API 函数在 EventListener 中调用的自定义函数中不起作用

Question

我在 header 部分定义了一个自定义函数，用于检查、提醒用户，并在特定滑块未通过某些限制时重置其值。

这个函数在点击问题时调用时效果很好：

  this.questionclick = chkVals;

我还想运行当用户退出文本输入字段时的功能（因为一些用户正在使用键盘进行调查）。我为每个滑块的文本输入字段实现了一个事件侦听器，当焦点不在文本输入字段中时，运行s 函数。

// choices is an array of choice ids 
  for (i = 0; i < choices.length; i++) {
    var x = document.getElementById(choices[i]);
    x.addEventListener("blur", chkVals, true);
  };

我知道事件侦听器可以正常工作，因为会弹出正确的警报。它只是无法重置值，因为 this.setChoiceValue 不是环境中的函数。我试过在函数中设置var that = this;并调用that.setChoiceValue，但还是不行。

任何帮助将不胜感激！

Answer 1

您没有显示所有代码，所以我在做一些假设。

this 是 addOnload 函数中的 Qualtrics 问题对象。由于 chkVals 在 addOnload 函数之外，因此 this（或 that）未定义。因此，您需要在函数调用 (function chkVals(qobj)) 中传递它，然后在 chkVals 函数中使用 qobj.setChoiceValue。然后你的函数调用变成：

this.questionClick = chkVals(this);

和

x.addEventListener("blur", chkVals(this), true);

Answer 2

@T。长臂猿的回答帮助我达到了这一点。根据建议，我需要向 chkVals() 添加一个参数才能引用 this object。然而，

this.questionClick = chkVals(this);

由于 this 是保留的 object，

不起作用，因此整个 header 脚本不会运行。我最终在我的自定义函数中将 this 的所有引用更改为 that 并按照建议添加参数 that：

function chkVals(that) {
...
... that.setChoiceValue(x, y)
}

要使用参数调用函数，我必须显式定义一个调用 chkVals 的匿名函数，否则它将无法工作（我不确定为什么）：

  var that = this; 

  this.questionclick = function() {chkVals(that);}

  for (i = 0; i < choices.length; i++) {
  var x = document.getElementById(choices[i]);
  x.addEventListener("blur", function() {chkVals(that);}, true);

  };

以上有效！

Qualtrics API 函数在 EventListener 中调用的自定义函数中不起作用

Qualtrics API functions not working within custom function called in EventListener

javascript

onblur

dom-events

qualtrics