按名称或ID的一部分获取元素(Get element by part of Name or ID)

2019-08-20 06:39发布

这里是我的表格的一个例子(仅输入,我想,但有许多其他的):

<form name="inputform" action="..." method="post">
<input type="hidden" name="id_qtedje_77" id="id_qtedje_77" value="0">
<input type="text" id="id_qte_77" name="prestation_detail_fields[77][qte_collecte]" value="0.00">
<input type="text" id="id_rec_77" name="prestation_detail_fields[77][reliquat_conforme]" value="0.00">
<input type="text" id="id_ren_77" name="prestation_detail_fields[77][reliquat_non_conforme]" value="0.00">
<input type="checkbox" name="prestation_detail_fields[77][dechet_non_present]" value="1">

<!-- another TR -->

<input type="hidden" name="id_qtedje_108" id="id_qtedje_108" value="0">
<input type="text" id="id_qte_108" name="prestation_detail_fields[108][qte_collecte]" value="0.00">
<input type="text" id="id_rec_108" name="prestation_detail_fields[108][reliquat_conforme]" value="0.00">
<input type="text" id="id_ren_108" name="prestation_detail_fields[108][reliquat_non_conforme]" value="0.00">
<input type="checkbox" name="prestation_detail_fields[108][dechet_non_present]" value="1">
</form>

我想要的是得到的输入值,但形式是建立在PHP中,我不知道线路识别符(77,108)。

有没有办法做这样的事情getElementByName('id_qtedje_%')

注:我没有使用任何库,我不打算使用一个。

Answer 1:

你最好的选择可能是document.querySelectorAll ,您可以使用任何CSS选择器,包括选择“属性开头”像input[id^="id_qtedje_"] 它支持所有现代浏览器,并且还IE8 :

var elements = document.querySelectorAll('input[id^="id_qtedje_"]');

如果你想仅仅是第一场比赛(而不是一个列表),你可以使用document.querySelector代替。 它返回文档顺序第一个匹配的引用,或null如果没有匹配。

或者,你可以给元素的类名,然后使用document.getElementsByClassName ,但要注意的是,虽然getElementsByClassName是在旧版本的Chrome和Firefox的支持,IE8没有它,所以它没有得到很好的支持的更多-有用querySelectorAll在当今时代。

var elements = document.getElementsByClassName("theClassName");

如果你使用的库(jQuery的,MooTools的,封闭器,样机等),他们可能有一个功能,您可以使用几乎任何CSS选择器来查找元素,填补了浏览器支持的空缺与自己的代码。 举例来说,在jQuery的,它是$jQuery )功能; 在MooTools的和原型,它的$$



Answer 2:

您可以使用开始有选择在jQuery的

var listOfElements = $('[name^="id_qtedje_"]')

您还可能有兴趣与包含和结尾选择


使用querySelectorAll ,你可以做

document.querySelectorAll( '[名^ = “id_qtedje_”]')


或者:

假设所有的元素都是input S,你可以使用这个:

function getElementByNameStart(str){
var x=document.getElementsByTagName('input')
 for(var i=0;i<x.length;i++){
  if(x[i].indexOf(str)==0){
  return x[i];
 }
}
}

这可以称为getElementByNameStart(“id_qtedje_”)

请注意,这仅返回此类型的第一个元素。 要返回所有:

function getElementByNameStart(str){
var x=document.getElementsByTagName('input')
var a=[];
for(var i=0;i<x.length;i++){
  if(x[i].indexOf(str)==0){
   a.push(x[i])
  }
}
return a;
}

如果要素是任何类型的,将“输入”与“*”(注意,这可能使你的代码慢)



文章来源: Get element by part of Name or ID