Question

我在一个对象中有一个对象，它包含一个值为jQuery函数的属性：

var fields = {
    id: {},
    timeStarted: {},
    duration: {},
    status: {},
    name: {
        field: $("#companyName"),
        changeEvent: $("#companyName").on("click", function(){
            alert("bazinga!");
        })
    }
};

我还有另一个函数遍历fields中找到的所有值并尝试注册更改事件：

function registerChangeEvents(){
    $.each(fields, function(field, v){
        $.each(v, function(prop, vv){
            // check which property the loop is on: if changeEvent
            if (prop == "changeEvent"){
                vv();
            }
        });
    });
}

但是，当我运行registerChangeEvents()时，控制台会返回Uncaught TypeError: object is not a function。我可以用changeEvent包装function(){...}的值，这将使它成为一个运行良好的函数。但是出于某种原因，这似乎不是正确的方法。

如果您有任何想法，请告诉我。

感谢。

Answer 1

当你有这个：

changeEvent: $("#companyName").on("click", function(){
    alert("bazinga!");
})

代码立即执行，.on()的结果是原始选定对象...仅$("#companyName")。所以changeEvent设置为jQuery对象，包含id“companyName”的元素。

我会将name更改为：

name: {
    field: "#companyName",
    changeEvent: function(){
        alert("bazinga!");
    }
}

然后将您的功能更改为：

function registerChangeEvents(){
    $.each(fields, function(prop, v){
        var field, changeEvent;
        $.each(v, function(propp, vv){
            if (propp === "field") field = vv;
            if (propp === "changeEvent") changeEvent = vv;
        });
        if (field && changeEvent) $(field).on("change", changeEvent);
    });
}

我对一件事感到困惑 - 你称之为“changeEvent”，但原始代码中的event是为了“点击”。

Answer 2

如果您希望注册更改事件，则需要包含点击处理程序附件：

name: {
    field: $("#companyName"),
    changeEvent: function() {
        this.field.on("click", function(){
            alert("bazinga!");
        });
    }
}

然后这样称呼：

$.each(fields, function(field, v) {
    if ($.isFunction(v.changeEvent)) {
        v.changeEvent();
    }
}

jQuery函数作为对象的属性值

2 个答案: