[英]Call function outside addEventListener method
I have a JavaScript code that creates a 10x10 table, and when I click on a cell an addEventListener method prints the x,y cordinates and execute a function like below: 我有一个创建10x10表的JavaScript代码,当我单击一个单元格时,addEventListener方法将打印x,y坐标并执行如下函数:
create_grid(name){
var dim = 10;
var my_field = document.createElement("table");
for (var i = 0; i < dim; i++) {
var row = document.createElement("tr");
for (var j = 0; j < dim; j++) {
var td = document.createElement("td");
td.setAttribute("id", i + "," + j);
td.addEventListener("click", function () {
var obj = {
x: this.id.split(",")[0],
y: this.id.split(",")[1]
};
console.log("cell pressed: " + obj.x + " " + obj.y);
});
row.appendChild(td);
}
my_field.appendChild(row);
}
document.getElementById(name).appendChild(my_field);
}
I have another function like: 我有另一个功能,如:
myFunction(x,y){
// do something
}
I would like to call myFunction inside the addEventListener of create_grid function: 我想在create_grid函数的addEventListener内部调用myFunction:
td.addEventListener("click", function () {
var obj = {
x: this.id.split(",")[0],
y: this.id.split(",")[1]
};
console.log("cell pressed: " + obj.x + " " + obj.y);
myFunction(obj.x, obj.y); // THIS DOESN'T WORK!
});
The structure of the typescript file il this: 打字稿文件的结构如下:
export class gameComponent {
create_grid(name){
// code
}
myFunction(x,y){
// code
}
}
Try 尝试
function myFunction(x,y){ console.log(x+'-'+y); } function create_grid(name){ var dim = 10, s=''; for(let i=0; i<dim; i++) { s+='<tr>' for(let j=0; j<dim; j++) s+=`<td onclick="myFunction(${[i,j]})">x</td>`; s+='</tr>' } this[name].innerHTML= '<table>' + s + '</table>'; } create_grid('xxx');
td {cursor: pointer}
Click on 'x': <div id='xxx'></div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.