[英]how to use $(this) with foreach in javascript using jquery
I am working on a personal project in Javascript to allow people to create a table of "dream plays" in Scrabble. 我正在使用Javascript进行个人项目,以使人们可以在Scrabble中创建“梦想中的戏剧”表。 Here is the link: http://psyadam.neoclaw.net/tables8.html
这是链接: http : //psyadam.neoclaw.net/tables8.html
I am currently trying to allow the user to edit a dream play. 我目前正在尝试允许用户编辑梦幻剧。
Here is my code: 这是我的代码:
function editRow(e)
{
var eventEl = e.srcElement || e.target,
parent = eventEl.parentNode
parent = parent.parentNode
var test = $(parent.cells[0]).text()
$('tr').each(function(){
$(this).children("td:contains(test)").each(
function()
{
pageEnd.innerHTML += "success"
$(this).addClass('selected')
}
)
})
pageEnd.innerHTML += test
//pageEnd.innerHTML += $(parent.cells[3]).text()
insertRow()
}
// insertRow assumes that the correct row in the table has the "selected" class added to it
function insertRow()
{
var Row = $('<tr>').append(
$('<td>').append('<input id="input1">'),
$('<td>').append('<select id="input2"><option value=""></option><option value="Yes">Yes</option><option value="No">No</option></select>'),
$('<td>').append('<select id="input3"><option value=""></option><option value="Natural">Natural</option><option value="1 Blank Used">1 Blank Used</option><option value="2 Blanks Used">2 Blanks Used</option></select>'),
$('<td>').append('<select id="input4"><option value=""></option><option value="vs Computer">vs Computer</option><option value="Online Game">Online Game</option><option value="Friendly Game">Friendly Game</option><option value="Club Game">Club Game</option><option value="Tournament Game">Tournament Game</option></select>'),
$('<td>').append('<input id="input5">')
)
$("#myTable tr.selected").after(Row)
}
Right now I'm just trying to get my code to insert a row into the table. 现在,我只是想让我的代码在表中插入一行。 I am trying to do this by using the code
$(this).addClass('selected')
to tag the row the user selected and then use it in my insert function to insert a row. 我试图通过使用代码
$(this).addClass('selected')
来标记用户选择的行,然后在我的插入函数中使用它来插入行来做到这一点。 However, nothing seems to happen. 但是,似乎什么也没有发生。 I am using
pageEnd.innerHTML += "success"
as a debugging tool to see if it is even getting there. 我正在使用
pageEnd.innerHTML += "success"
作为调试工具,以查看它是否到达那里。 Unexpectedly, it prints success twice when it should only print once, as in the test I ran every word was unique. 出乎意料的是,它只打印一次时就打印两次成功,因为在我运行的测试中,每个单词都是唯一的。
In any case I can't figure out why it's not working. 无论如何,我不知道为什么它不起作用。 Any help is appreciated.
任何帮助表示赞赏。 Thanks, ~Adam
谢谢,〜亚当
Try this: 尝试这个:
function editRow(e) {
var eventEl = e.srcElement || e.target,
parent = eventEl.parentNode
parent = parent.parentNode
var test = $(parent.cells[0]).text()
$('tr').each(function(){
var outerThis = this;
outerThis.children("td:contains(test)").each(
function()
{
pageEnd.innerHTML += "success";
$(this).children().css('text-align', 'center');
}
)
})
pageEnd.innerHTML += test
//pageEnd.innerHTML += $(parent.cells[3]).text()
insertRow()
}
I set the outer this
to a variable which you can use. 我将外部
this
设置为可以使用的变量。 Also textAlign
is not a jQuery function. 同样,
textAlign
不是jQuery函数。 You need to use .css()
and then specify text-align
in that. 您需要使用
.css()
,然后在其中指定text-align
。
You have two options to achieve this: 您有两种选择可以实现此目的:
The first one as the others are suggesting ie by keeping a variable of outer this
and then using this: 正如其他人所建议的那样,第一个建议是通过保留外部变量
this
,然后使用此变量:
$('tr').each(function() {
var outerThis = this;
// inside another loop (not sure about children method, just an example)
$(outerThis).children("td:contains(test)").each(function() {
// do something with outerThis to operate on further
});
});
Another option to use Javascript's bind()
method: 使用Javascript的
bind()
方法的另一种选择:
$('tr').each(function(i, trElement) {
// this == trElement
// inside another loop
$(outerThis).children("td:contains(test)").each(function(index, tdElement) {
$(this) // will be now tr element
$(tdElement) // will be td element
}.bind(this));
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.