Question

我有一个函数需要在触发事件时调用，但由于某种原因我得到语法错误。当我将函数放在事件监听器中时，它曾经工作正常，但现在我需要能够调用它。

rbProject.addEventListener('change', rbProjectClicked()) { // LINE WITH ERROR

})

function rbProjectClicked(){

    txtReference.placeholder = "Insert project reference";
    txtTitle.placeholder = "Insert project title";
    txtReference.value = ""
    txtTitle.value = "";
    txtReference.disabled = false;
    txtTitle.disabled = false;
    document.getElementById('divProjectManager').style.display = '';
    document.getElementById('divAccountManager').style.display = 'none';

    document.getElementById('divAccountFeedback').style.display = 'none';
    document.getElementById('divClientFeedbackOver').style.display = '';
    document.getElementById('divClientFeedbackUnder').style.display = '';
}

Answer 1

您将rbProjectClicked()的结果绑定到change事件，而不是函数引用。

请改为：

rbProject.addEventListener('change', rbProjectClicked);

注意，我从()删除了rbProjectClicked。 ()调用函数调用，但您只想绑定对函数的引用。 rbProjectClicked是对函数的引用。

Answer 2

问题在于：

rbProject.addEventListener('change', rbProjectClicked()) { // LINE WITH ERROR

})

在javascript中，有两种方法可以声明一个函数，你可以像这样声明一个匿名函数：

function (params ...) {...}

或命名函数：

function name(params ...) { ... }

命名声明是“先解释”的，因此声明它们的顺序无关紧要。如果你写了

rbProject.addEventListener('change', rbProjectClicked);
var rbProjectClicked = function () { ... }

这不行。以下代码段可行。在你真正使用它们之前宣布它们通常是一个好主意，但我想这是一个品味问题：

rbProject.addEventListener('change', rbProjectClicked);
function rbProjectClicked() { ... }

你真正想要的是：

function rbProjectClicked(){
    txtReference.placeholder = "Insert project reference";
    txtTitle.placeholder = "Insert project title";
    txtReference.value = ""
    txtTitle.value = "";
    txtReference.disabled = false;
    txtTitle.disabled = false;
    document.getElementById('divProjectManager').style.display = '';
    document.getElementById('divAccountManager').style.display = 'none';

    document.getElementById('divAccountFeedback').style.display = 'none';
    document.getElementById('divClientFeedbackOver').style.display = '';
    document.getElementById('divClientFeedbackUnder').style.display = '';
}


rbProject.addEventListener('change', rbProjectClicked);

但是，我们尚未完成。正如我所看到的，您似乎将匿名函数与命名函数混合在一起。

您想要输入的内容可能是：

rbProject.addEventListener('change', function () {
   // code here
});

如您所见，我将一个函数声明为addEventListener的参数。使用匿名函数的原因纯粹是语法。它有时更容易阅读。

从“AddEventListener”启动一个函数？

2 个答案: