使用动态标识查找元素

我想在jQuery中创建一个通用函数来选择所有功能。我的网页上有一个标签页。使用动态标识查找元素

我的组件的ID是：tabId：someDynamicId：rowId：componentId 其中，someDynamicId是动态生成的。

所以在jquery中，我想查找以id开始的元素--tabId：someDynamicId &以componentId结尾。而且，tabId，someDynamicId & componentId将作为参数传递给需要查找此元素的泛型函数。

2012-03-30 Tarun Madaan

很简单：

$('[id^=tabId][id$=componentId]').each(function(){ 
    var id = $(this).attr('id'); // tabId:someDynamicId:rowId:componentId 
    var list = id.split(':'); 

    console.log(list[0]); // tabId 
    console.log(list[1]); // someDynamicId 
    console.log(list[2]); // rowId 
    console.log(list[3]); // componentId 
})

Wildcards in jQuery selectors

，但我建议为此工作使用正确的工具。 ID对于查找特定元素非常有用，但在您的情况下，最好使用一个或两个类和数据属性。例如：

<div class="tabs" data-component-id="x" data-tab-id="y">

然后找到所有$元素，并使用$（本）。数据（ '组件ID '）和$（本）。数据（' 标签ID '）（' 标签'。）

$('.tabs').each(function(){ 
    var component_id = $(this).data('component-id'); 
    var tab_id = $(this).data('tab-id'); 
});

更新：

有例如使用其作为函数的：

function(tabId,componentId) { 
    $('[id^='+tabId+'][id$='+componentId+']').each(function(){ 
     var id = $(this).attr('id'); // tabId:someDynamicId:rowId:componentId 
     var list = id.split(':'); 

     console.log(list[0]); // tabId 
     console.log(list[1]); // someDynamicId 
     console.log(list[2]); // rowId 
     console.log(list[3]); // componentId 
    }) 
}

来源

2012-03-30 05:31:57

+1这真棒！ – tusar 2012-03-30 05:40:32

感谢的人..它工作:) :) – 2012-03-30 06:46:51

你可以用正则表达式和filter()来做到这一点。像这样的东西应该工作。这个特殊的例子寻找一个以“one”开头，后跟一个数字并以“two”结尾的id。检查示例http://jsfiddle.net/5eXm4/。

$.fn.regexFindId = function(re){ 
    return this.filter(function(){ 
     var id = this.id; 
     return id.match(re); 
    }); 
};

编辑：可以在正则表达式中使用变量只是宣布他们是这样的：

var re = new RegExp(myVar);

来源

2012-03-30 05:28:40 elclanrs

好一个兄弟，但我想使用变量。我不能像正则表达式那样硬编码我的函数，因为在我的情况下，我不知道这个id将以一个或两个或三个开始。那么该怎么做？请回复。 – 2012-03-30 05:35:44

你必须从你的ID中提取一个模式并与之匹配。典型的组件ID如何看起来像？另见编辑 – elclanrs 2012-03-30 05:38:21

function(tableid, dynamicid, componentid) 
    { 
    a = tableid+dynamicid ;  
    $(" [id^="+a+"][id$="+componentid+"] "). each(function() 
    { 
        // do ur stuff 
    } 
    ); 
    }

来源

2012-03-30 06:26:17 abhi

使用动态标识查找元素

回答

相关问题