javascript - Onsubmit 事件拒绝触发

Question

所以我有这个代码。

class Validationator
{
    constructor()
    { 
        this.initValidation()
    }

    initValidation()
    {
        window.addEventListener("load", this.PerformOnLoad, false);
    }

    PerformOnLoad()
    {
        var form = document.querySelector("#feedbackcontainer");

        form.addEventListener("onsubmit", this.SubmitClicked);
    }

    SubmitClicked()
    {
        alert("asdf");
    }
}

我试过同时使用“提交”和“提交”，但都没有工作。我已经验证查询选择器正在获取正确的表单。请原谅我是 Javascript 的初学者。事件处理程序不断击败我。

标签： javascripthtml

Answer 1

事件的名称不包括on前缀——仅在相应的属性名称中使用。

此外，如果您使用类方法作为回调函数，则需要将其绑定到对象。否则，this方法中将是全局window对象，而不是Validationator对象。

class Validationator
{
    constructor()
    { 
        this.initValidation()
    }

    initValidation()
    {
        window.addEventListener("load", this.PerformOnLoad.bind(this), false);
    }

    PerformOnLoad()
    {
        var form = document.querySelector("#feedbackcontainer");

        form.addEventListener("submit", this.SubmitClicked.bind(this));
    }

    SubmitClicked()
    {
        alert("asdf");
    }
}