1

我有一个对象，它定义了要在页面元素的单击事件中调用的函数的名称和参数。

object_array = [
    {
       id: "id1",
       onclick: "load_file(filename.php);",
    },

    {
       id: "id2",
       onclick: "open_url('http://url.com');",
    }
];

必须动态检索该信息。我想在 click 事件中为数组中的给定对象调用 onclick 函数。

$('element').click(function() {
      // call object.onclick
});

似乎 eval() 不是一个好的选择。调用该函数有不同的方法吗？

4

3 回答 3

2

这是一个有效的 jsfiddle：http: //jsfiddle.net/Zh6Fv/1/

像这样：

 object_array = [
        {
           id: "id1",
           // Encapsulate in an anonymous function
           onclick: function(){ load_file('filename.php'); },
        },
        {
           id: "id2",
           // Encapsulate in an anonymous function
           onclick: function(){ open_url('http://url.com'); },
        }
    ];

然后像这样实际绑定它::

$('element').click(obj.onclick);

大概你会像这样使用它::

object_array.forEach(function(obj){
     // Note there is no need to wrap the obj.onclick
     // into another anonymous function anymore!
     $("#" + obj.id).click(obj.onclick);
});

这是一个有效的 jsfiddle：http: //jsfiddle.net/Zh6Fv/1/

于 2012-05-16T00:56:09.740 回答
2

您应该将其重构object_array为：

[{
    id: "id1",
    action: "load_file",
    url: "filename.php"
}, {
   id: "id2",
   action: "open_url",
   url: 'http://url.com'
}];

然后你可以调用它：

var actions = {
    load_file: function(url) {
        ...
    },
    open_url: function(url) {
        ...
    },
    ...
};
object_array.forEach(function(ob) {
    $("#"+ob.id).click(function() {
        actions[ob.action](ob.url);
    });
});

如果您有更复杂的参数，您还可以提供一个参数数组，而不是在函数上url使用apply()。

或者，如果您只想要一个函数查找表，请使用：

var object = {
    "id1": function() {
        load_file('filename.php');
    },
    "id2": function() {
        open_url('http://url.com');
    }
};
$('element').click(function() {
    object[this.id]();
});
于 2012-05-16T00:58:02.673 回答
0

you can declare a function like

onclick : function()
{
   action(arguments);
}
于 2012-05-16T00:45:28.253 回答