该功能不起作用答案

【问题标题】：The function doesn't work该功能不起作用
【发布时间】：2018-08-19 11:35:08
【问题描述】：

这段代码有问题。当我编写第一个代码时，一切正常，但处理后它不起作用。为什么会这样？我发送了一个事件对象作为参数起作用，那么有什么问题？

初始代码：

var isOkej = null;
function isNumber(someValue) {
    return !isNaN(someValue);
}
window.onload = function () {
    var wykonawca = document.getElementById("informations").artist;
    var tytul = document.getElementById("informations").title;
    var label = document.getElementById("informations").label;
    var kindOftxt = document.getElementById("kindOftxt");

    var action = function (e) {
        //pokazuje unicode wpisanego znaku
        var wpisanyZnak = e.which;
        if (isNumber(this.value) || wpisanyZnak === 190) {
            e.preventDefault();
            if (this === wykonawca)
                kindOftxt.innerHTML = "Podaj swój Alias";
            else if (this === tytul)
                kindOftxt.innerHTML = "Podaj tytuł utworu";
            else
                kindOftxt.innerHTML = "Gdzie utwór został wydany";

            this.style.backgroundColor = "red";
            isOkej = false;
        } else {
            this.style.backgroundColor = "green";
            kindOftxt.innerHTML = "";
            isOkej = true;
        }
    };
    wykonawca.onkeyup = action;
    tytul.onkeyup = action;
    label.onkeyup = action;
}

最终代码：

function isNumber(someValue) {
    return !isNaN(someValue);
}
var isOkej = null;
 function action (e, wykonawca, tytul,kindOftxt) {
        //pokazuje unicode wpisanego znaku
        var wpisanyZnak = e.which;
        if (isNumber(this.value) || wpisanyZnak === 190) {
            e.preventDefault();
            if (this === wykonawca)
                kindOftxt.innerHTML = "Podaj swój Alias";
            else if (this === tytul)
                kindOftxt.innerHTML = "Podaj tytuł utworu";
            else
                kindOftxt.innerHTML = "Gdzie utwór został wydany";

            this.style.backgroundColor = "red";
            isOkej = false;
        } else {
            this.style.backgroundColor = "green";
            kindOftxt.innerHTML = "";
            isOkej = true;
        }
    };

window.onload = function () {
    var wykonawca = document.getElementById("informations").artist;
    var tytul = document.getElementById("informations").title;
    var label = document.getElementById("informations").label;
    var kindOftxt = document.getElementById("kindOftxt"); 

    wykonawca.onkeyup = function (e) {
        action(e, wykonawca,tytul,kindOftxt);
    };    
     tytul.onkeyup = function (e) {
        action(e, wykonawca,tytul,kindOftxt);
    };    
    label.onkeyup = function (e) {
        action(e, wykonawca,tytul,kindOftxt);
    };    }

我真的不知道可能是什么原因。您认为可能是什么问题？

【问题讨论】：

您能具体说明一下这个问题吗？什么不工作？你有错误吗？
没有错误，但我的意思是“kindOftxt”字段没有响应输入的信息并且没有改变颜色
@kamilss15 您不应该使用 isNaN 检查某事物是否为数字。 isNaN 函数的目的是确定某物是否是实际的NaN 值。
在第二种情况下，this 内部函数 action() 的值不是您所期望的。它不再指代事件发生的元素。尝试一件事将您的所有this 更改为e.currentTarget
@EKW 但在初始代码中一切正常。问题出在最终代码中

标签： javascript events arguments

【解决方案1】：

当您使用以下代码绑定事件时，action 函数内的 this 将绑定到输入元素。

wykonawca.onkeyup = action;
tytul.onkeyup = action;
label.onkeyup = action;

当你用更新的代码绑定事件时

wykonawca.onkeyup = function (e) {
    action(e, wykonawca,tytul,kindOftxt);
};    
tytul.onkeyup = function (e) {
   action(e, wykonawca,tytul,kindOftxt);
};    
label.onkeyup = function (e) {
    action(e, wykonawca,tytul,kindOftxt);
};

匿名事件处理程序中的this 绑定到输入元素，但在action 函数中，this 将引用全局对象，即窗口对象。

您可以将匿名处理程序中的this 引用作为附加参数传递给action 函数。

【讨论】：