使用关联数组中的数据作为事件处理程序的对象

Question

下午

我有一些数据 -

    var searchwithin = [
{id:"clearwithin", type:"button"},
    {id:"search_radius", type:"select"},
    {id:"for_lease" ,type:"checkbox"},
{id:"for_sale", type:"checkbox"},
]; 

它将根据单击的内容显示和隐藏信息（这只是数据的一小部分。

我已经弄清楚如何检查类型属性，我想知道的是以下内容：

如果类型是按钮，我如何访问该项目的 id 值，然后生成一个单击函数，以便使用 id 作为与该函数关联的按钮的名称

预先感谢

菲尔。

Answer 1

首先，通过删除表中最后一项后面的逗号来修复 searchwithin 表中的语法错误。这会导致 IE6/IE7 出现错误。

然后，您可以使用此代码查看 searchwithin 数组以查找相应 type 的 id，然后设置一个点击事件处理程序那个id。

var searchwithin = [
    {id:"clearwithin", type:"button"},
    {id:"search_radius", type:"select"},
    {id:"for_lease" ,type:"checkbox"},
    {id:"for_sale", type:"checkbox"}
]; 

function findIdByType(target) {
    for (var i = 0; i < searchwithin.length; i++) {
        if (searchwithin[i].type === target) {
            return(searchwithin[i].id);
        }
    }
}

var id = findIdByType("button");
if (id) {
    $("#" + id).click(function() {
        // do whatever you want to do on the click function here
    }
});

我注意到您的表格有两个 type:checkbox 条目。上面的代码建议将返回并仅对第一个条目进行操作。如果您想为这两个 ID 设置点击处理程序，则必须修改代码或表。如果这就是表的全部用途，则可以将其更改为选择器（可以包含多个 id），如下所示：

var searchwithin = [
    {id:"#clearwithin", type:"button"},
    {id:"#search_radius", type:"select"},
    {id:"#for_lease, #for_sale", type:"checkbox"}
]; 

function findSelectorByType(target) {
    for (var i = 0; i < searchwithin.length; i++) {
        if (searchwithin[i].type === target) {
            return(searchwithin[i].id);
        }
    }
}

var selector = findSelectorByType("button");
if (selector) {
    $(selector).click(function() {
        // do whatever you want to do on the click function here
    }
});

Answer 2

连接“#”和 id 属性并使用生成的字符串作为选择器。

$.each($.grep(searchwithin, function(i) { return i.type=='button'; }), 
    function () { 
        var item = this;
        $('#'+this.id).bind('click', function(e) {
            alert('clicked: ' + item.id +' '+ item.type);
        });
    });

考虑使用选择器来查找元素而不是 ID 映射。

$('input[type="button"].search').bind('click', onSearch);