2017-02-20 86 views
1

數倍的元素我有這個簡單的代碼:獲取該ID的jQuery的

$('[id^=pz]').change(function() { 
 

 
    //Getting the numbers after the letters "pz": 
 
    //1 
 
    //2 
 
    //100 
 

 
});
<input type="text" id="pz1"> 
 
<input type="text" id="pz2"> 
 
<input type="text" id="pz100">

如何檢索每個元素的數量?

謝謝。

+1

'VAR NUM = this.id.substr(2);'! –

+0

非常感謝你@ibrahim mahrir – eawedat

回答

0

在這裏,你去。使用Array#match與簡單的RegExp

點擊任何輸入揭示它的數量。

$('input').click(function(){ 
 
    console.log($(this).attr('id').match(/(?!pz)\d+/g)[0]); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="pz1"> 
 
<input type="text" id="pz2"> 
 
<input type="text" id="pz100"> 
 
<input type="text" id="pwadawdz7"> 
 
<input type="text" id="random98">

+0

非常感謝你+1 – eawedat

+0

笑:)是的,你說得對,你的回答是最好的一個,你真的應該說, – eawedat

+0

*「我真的很在乎你的未來爲開發者,這就是爲什麼我建議你使用我的代碼「*這是一個好笑話,謝謝你的笑聲。 – epascarello

1

可以使用match功能:

var m = $(this).attr('id').match("pz([0-9]+)"); // m = ["pz1", "1"] 
var num = m[1]; 

match需要一個正則表達式,並返回輸入匹配的正則表達式以及可能捕獲組(即東西匹配括號內的部分)。

注:最新的jQuery,使用prop()代替attr()

1

只要做到這一點;)

$('[id^=pz]').change(function(event) { 
 

 
// with substr must have 2 chars 
 
var id = event.target.id.substr(2); 
 
console.log('substr', id) 
 

 
// with regexp 
 
var id2 = event.target.id.match('[0-9]+')[0]; 
 
console.log('regexp', id2) 
 

 

 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<input type="text" id="pz1"> 
 
<input type="text" id="pz2"> 
 
<input type="text" id="pz1000000"> 
 
<input type="text" id="pzdsfg1000000">

+0

非常感謝你 – eawedat

+0

哼,不...試試吧! –

+0

如果單詞有兩個以上的字符,會發生什麼情況?像pzez300? – eawedat

1

$('[id^=pz]').change(function() { 
 

 
console.log($(this).attr("id").split("pz")[1]) 
 

 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="pz1"> 
 
<input type="text" id="pz2"> 
 
<input type="text" id="pz100">

1

$('[id^=pz]').change(function() { 
 

 
    
 
    // Getting the numbers after the letters "pz": 
 
    console.log(this.id.replace("pz", "")); 
 

 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="pz1"> 
 
<input type="text" id="pz2"> 
 
<input type="text" id="pz100">

+0

對不起!愚蠢的錯誤,我以爲我正在編輯這個問題! –

1

On changeing,你必須使用document.querySelectorAll()讓所有的元素first.Then使用forEach獲得的id每個元素和match值的輸入使用regular expression需要的數字。

$('[id^=pz]').change(function() { 
 
    var pz = document.querySelectorAll('[id^=pz]'); 
 
    values = []; 
 
    pz.forEach(function(pz){ 
 
    values.push(pz.getAttribute('id')); 
 
    }) 
 
    values.forEach(function(value){ 
 
    console.log(value.match(/(?!pz)\d+/g)[0]); 
 
    }); 
 
     });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="pz1"> 
 
    <input type="text" id="pz2"> 
 
    <input type="text" id="pz100">

+0

爲什麼要混合使用jQuery和DOM? – epascarello

+0

@epascarello我編輯了它。 –

0

可能是一個更好的解決方案有ID作爲數據屬性,所以你不必撕裂出來的id。

$("[data-pz]").on("change", function(){ 
 
    var elem = $(this); 
 
    console.log(elem.data("pz")); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input data-pz="1"/> 
 
<input data-pz="10"/> 
 
<input data-pz="100"/>

0

您可以使用正則表達式,像這樣:

$.each($('[id^=pz]'), function (_, item) { 
    var match = item.id.match(/pz(\d+)/); 
    if(match) { 
    console.log(match[1]); 
    } 
});