jQuery 如何获取以给定字符串开头的特定类的元素?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15505745/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get elements of specific class starting with a given string?
提问by fatiDev
I have a list of elements that have multiple classes, for example:
我有一个包含多个类的元素列表,例如:
<input class="etape btn-info others">
<input class="etape btn-inverse others">
<input class="etape btn-danger others">
How to write jQuery-code that will allow me the following...
如何编写允许我执行以下操作的 jQuery 代码...
$(".etape").click(function(){
$(this).get("the class that starts with btn-")
// in order to store this value in a variable to reuse it later
});
回答by undefined
You can use Regular Expression or split
the class name.
您可以使用正则表达式或split
类名。
$(".etape").click(function(){
var classes = $.grep(this.className.split(" "), function(v, i){
return v.indexOf('btn') === 0;
}).join();
});
回答by Marc Audet
You can also try:
你也可以试试:
$(".etape").click(function () {
var theClass = $(this).attr("class").match(/btn[\w-]*\b/);
console.log(theClass);
});
Uses match instead of grep...
使用 match 而不是 grep ...
回答by xyz
// Only select input which have class
$('input[class]').click(function(){
var myClass;
// classNames will contain all applied classes
var classNames = $(this).attr('class').split(/\s+/);
// iterate over all class
$.each(classNames, function(index, item) {
// Find class that starts with btn-
if(item.indexOf("btn-") == 0){
// Store it
myClass = item;
}
});
});
回答by Marcus
It would probably be better to store those values in the data
attribute:
将这些值存储在data
属性中可能会更好:
<input class="etape others" data-btntype="info">
<input class="etape others" data-btntype="inverse">
<input class="etape others" data-btntype="danger">
Then:
然后:
$(".etape").click(function(){
var myBtnType = $(this).data('btntype');
});
回答by Lorin
Try this: $('input[class*='btn']').attr("class");
尝试这个: $('input[class*='btn']').attr("class");
回答by Eric Goncalves
You could just make btn its own class. However, this will work.
你可以让 btn 成为它自己的类。但是,这将起作用。
$("div[class^='btn-']")
回答by l2aelba
I just made @Vohuman 's function to reusable one :
我刚刚将 @Vohuman 的功能变成了可重用的功能:
// getClassStartsWith(classes,startswith);
// Example : getClassStartsWith( 'item w-2 h-4 hello' , 'h-' );
function getClassStartsWith(t,n){var r=$.grep(t.split(" "),function(t,r){return 0===t.indexOf(n)}).join();return r||!1}
Example...
例子...
HTML :
HTML :
<div class="item w-2 h-4 hello"></div>
JS :
JS:
var $element = $('.item');
var classes = $element[0].className;
var getHeight = getClassStartsWith(classes,'h-');
That will return h-4
, And if no class starts with h-
will return false
那将返回h-4
,如果没有类开始,h-
将返回false
回答by Mohamad Hamouday
This function can get Class, ID, Data and all kind of attributes using regex
此函数可以使用正则表达式获取 Class、ID、Data 和所有类型的属性
$.fn.Get_Attr_Regex = function(Pattern,Type)
{
Type = Type ||?'class';
var List_Str = this.attr(Type);
if(typeof List_Str !== typeof undefined && List_Str !== false)
{
var regex = new RegExp(Pattern, "g");
var List_Array = List_Str.split(" ");
for(var i = 0; i < List_Array.length; i++)
{
if(regex.test(List_Array[i]))
{
return List_Array[i];
}
}
}
return false;
};
To use it
使用它
$('.T_Header').Get_Attr_Regex('btn.*','class'); // => return class value which start with btnxxx
or
或者
$('.T_Header').Get_Attr_Regex('btn.*','id'); // => return id value which start with btnxxx
or
或者
$('.T_Header').Get_Attr_Regex('btn.*','data-info'); // => return data attribute value which start with btnxxx
回答by Alvaro
A class starting with btn
and which can not be the first class:
以btn
和开头的类不能是第一类:
Working fiddle: http://jsfiddle.net/c9Tdx/
工作小提琴:http: //jsfiddle.net/c9Tdx/
$("input[class^='btn'],input[class*=' btn']").each(function(){
//whatever
});
回答by FibreFoX
How about this? http://api.jquery.com/attribute-contains-word-selector/
这个怎么样? http://api.jquery.com/attribute-contains-word-selector/
$('input[class~="btn-"]')