Belirli bir sınıfa belirli bir dizeyle başlayan öğeler nasıl alınır?

Question

Ben örneğin, birden çok sınıfları unsurların bir listesi var:

<input class="etape btn-info others"> 
<input class="etape btn-inverse others"> 
<input class="etape btn-danger others"> 

Nasıl aşağıdaki beni sağlayacak jQuery kodu yazmak için ...

$(".etape").click(function(){ 
    $(this).get("the class that starts with btn-") 
    // in order to store this value in a variable to reuse it later 
}); 

Answer 1

Normal İfade veya split sınıf adını kullanabilirsiniz.

$(".etape").click(function(){ 
    var classes = $.grep(this.className.split(" "), function(v, i){ 
     return v.indexOf('btn') === 0; 
    }).join(); 
}); 

http://jsfiddle.net/LQPh6/

Answer 2

// 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; 
     } 
    }); 

    }); 

Live Demo

Answer 3

Bu nasıl? http://api.jquery.com/attribute-contains-word-selector/

$('input[class~="btn-"]') 

Answer 4

sadece kendi sınıfında btn yapabiliriz. Ancak, bu işe yarayacak.

$("div[class^='btn-']") 

Answer 5

btn ile A sınıfı başlangıç ​​ve birinci sınıf olamaz ki:

Çalışma keman: http://jsfiddle.net/c9Tdx/

$("input[class^='btn'],input[class*=' btn']").each(function(){ 
    //whatever 
}); 

Answer 6

bu deneyin: $('input[class*='btn']').attr("class");

Answer 7

Muhtemelen daha iyi olurdu Bu değerleri data özniteliğinde sakla:

Sonra

<input class="etape others" data-btntype="info"> 
<input class="etape others" data-btntype="inverse"> 
<input class="etape others" data-btntype="danger"> 

:

$(".etape").click(function(){ 
    var myBtnType = $(this).data('btntype'); 
}); 

jsFiddle

Answer 8

bu deneyin, kod test edilmemiştir

if($(selector).attr("class").lastIndexOf("classToStartFrom") == 0) 
    return "this selector class name starts with 'classToStartFrom'"; 
else 
    return "this selector class name doesn't start with 'classToStartFrom'"; 

.

Answer 9

Ayrıca deneyebilirsiniz:

$(".etape").click(function() { 
    var theClass = $(this).attr("class").match(/btn[\w-]*\b/); 
    console.log(theClass); 
}); 

grep yerine maçı kullanır ...

Answer 10

Demin ettiğim @Vohuman 'ın fonksiyonu birini yeniden kullanılabilir için:

// 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} 

Örnek ...

HTML:

<div class="item w-2 h-4 hello"></div> 

JS: h-4 dönecektir, Ve hiçbir sınıf h- ile başlıyorsa dönecektir

var $element = $('.item'); 
var classes = $element[0].className; 
var getHeight = getClassStartsWith(classes,'h-'); 

false

Demo:http://jsbin.com/mijujunaca/edit?js,console