[英]How to iterate over htmlCollection
I'm having some difficulty with this. 我对此有些困难。 In Backbone, I have a function like this:
在Backbone中,我有一个这样的函数:
functionOne: function(){
$('#myTExtbox-' + budgetLine.attr('id')).on('change keyup paste', function(){
that.mySecondFunction(this);
});
}
In this case, the this
is a textbox
, which is in a table
, inside a div
. 在这种情况下,
this
是一个textbox
,它位于div
中的table
。 Then: 然后:
mySecondFunction: function(tb){
var tbody = tb.parentElement.parentElement.parentElement.parentElement.parentElement;
//gets main parent, which is a tbody, inside a table, inside a div
}
I then want to iterate over tbody
, to go through each row and find a textbox
in a specific cell. 然后我想迭代
tbody
,遍历每一行并在特定单元格中找到一个textbox
。 The problem is that this code: 问题是这段代码:
$.each(tbody, function(index, item){
cost = item;
var t= index;
});
Doesn't seem to allow me to get to any of the items. 似乎不允许我去任何项目。 In this example, if I try to do something like:
在这个例子中,如果我尝试做类似的事情:
item.getElementById('test');
I get an error: 我收到一个错误:
TypeError: Object #<HTMLCollection> has no method 'getElementById'
Why can't I iterate over this object and access objects within? 为什么我不能迭代这个对象并访问其中的对象?
Thanks 谢谢
UPDATE UPDATE
Here's a fiddle: http://jsfiddle.net/HX8RL/14/ 这是一个小提琴: http : //jsfiddle.net/HX8RL/14/
Essentially, what should happen is this: When a text box changes, I want to iterate over all the rows in the tb's parent table and sum all the Tb values. 本质上,应该发生的是:当文本框发生变化时,我想迭代tb父表中的所有行并总结所有Tb值。 Keeping in mind, all the tb's in the same cell position, as there could be other tb's in other places that I dont want to include.
请记住,所有tb都处于相同的单元格位置,因为在其他地方我可能不想包含其他tb。
There wont be any collection of TBody
try using children()
instead 不会有任何
TBody
集合尝试使用children()
代替
$.each(tbody.children('tr'), function(index, item){
cost = item;
var t= index;
});
Iterate over all input elements directly to get values. 直接迭代所有输入元素以获取值。
var tbody = tb.parentElement.parentElement.parentElement;
alert(tbody.id);
var input = $('#tbody').find('input');
alert(input);
console.log(input);
for (var i = 0; i < input.length; i++) {
alert(input[i].value);
alert(i);
}
See fiddle- http://jsfiddle.net/HX8RL/18/ 见小提琴 - http://jsfiddle.net/HX8RL/18/
I think there are a few things going wrong here. 我认为这里有一些问题。 You know you can only have one ID per page?
你知道每页只能有一个ID吗? So you have to do
document.getElementByid('test')
instead. 所以你必须改为使用
document.getElementByid('test')
。
Since you are also using jQuery you can use the find function, item.find('#test')
. 由于您还使用jQuery,因此可以使用find函数
item.find('#test')
。 But I think this wouldn't solve you problem. 但我认为这不会解决你的问题。 Not sure what you want to achieve, maybe I can help you if you explain a bit more in detail what your problem is.
不知道你想要达到什么目标,如果你详细解释一下你的问题是什么,也许我会帮助你。
Also 也
tb.parentElement.parentElement.parentElement.parentElement.parentElement;
can be written as (in jQuery) 可以写成(在jQuery中)
$(tb).parents('tbody');
I've setup a fiddle , maybe it can help you. 我已经设置了一个小提琴 ,也许它可以帮助你。
Code used in fiddle: 小提琴中使用的代码:
var myFuncs = (function() {
function funcA() {
$('input').on('keyup', function() {
funcB(this);
});
}
function funcB(myInput) {
var $table = $(myInput).parents('table');
$table.find('tr > td > input').each(function() {
var $input = $(this);
if($(myInput).attr('id') != $input.attr('id'))
$input.val("I'm called from another input");
});
}
return {
funcA : funcA
}
})();
myFuncs.funcA();
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.