2017-02-20 82 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]); 
    } 
});