[英]JavaScript: variable name unresolved
I wrote the following JS code: 我编写了以下JS代码:
function downloadFile(dataItem) {
....
}
....
for (var r = 0; r < dataItems.length ; r++) {
table += '<tr>';
var listOfAttributes = ['CarModel', 'BusMapping', 'Date_', 'Location_', 'Comments', 'AttackTraffic', 'IsTagged']
**table +='<td> <a onclick="downloadFile(dataItems[r])" href="#">' + dataItems[r]['FileName']['S'] +'</a></td>';**
for (var c = 0; c < Object.keys(dataItems[0]).length-1 ; c++) {
table +='<td>' + dataItems[r][listOfAttributes[c]]["S"] +'</td>';
}
table+= '</tr>'
}
I get an error for the line: 我收到一条错误消息:
table +='<td> <a onclick="downloadFile(dataItems[r])" href="#">' + dataItems[r]['FileName']['S'] +'</a></td>';
It seems that JS can't resolve the variable 'dataItems' inside the -tag: 似乎JS无法解析-tag中的变量'dataItems':
<a onclick="downloadFile(dataItems[r])" href="#">.
However, later in the same line, JS resolves successfully the same name for the part: 但是,稍后在同一行中,JS成功解析了零件的相同名称:
+ dataItems[r]['FileName']['S'] +
What do you think can be the problem? 您认为可能是什么问题? How can I make dataItems be resolved inside the -tag ?
如何使dataItems在-tag中解析?
Your variable is inside a string. 您的变量在字符串中。 Try changing the code to:
尝试将代码更改为:
table +='<td> <a onclick="' + downloadFile(dataItems[r]) + '" href="#">' + dataItems[r]['FileName']['S'] +'</a></td>';**
In this line 在这条线
<a onclick="downloadFile(dataItems[r])" href="#">
unless dataItems
is a global variable, it won't be available to the environment which will make this call downloadFile(dataItems[r])
, since onclick event will be invoked in a global scope. 除非
dataItems
是全局变量,否则它将无法用于进行调用downloadFile(dataItems[r])
,因为onclick事件将在全局范围内调用。
You need to bind the event less intrusively this way 您需要以这种方式减少对事件的绑定
//you need to update the selector as per your markup
document.querySelector ( "tr td a" ).addEventListener( "click", function(){
downloadFile(dataItems[r]);
})
As you're placing a string inside the element's attribute it is not recognized as a JavaScript code or a JavaScript function so place the JavaScript function itself. 当您在元素的属性内放置字符串时,它不会被识别为JavaScript代码或JavaScript函数,因此请将JavaScript函数本身放置。
So you can do, var anchor = '<a href="#" onclick="' + your_func_here + '"></a>';
这样就可以了,
var anchor = '<a href="#" onclick="' + your_func_here + '"></a>';
A sample example illustrating the problem, in this example if you write the function name as a string in the onclick
property the function won't be called. 一个示例问题的示例,在此示例中,如果您在
onclick
属性中将函数名称写为字符串,则不会调用该函数。
var container = document.getElementById('container'); var element = document.createElement('a'); element.href = '#'; element.text = 'Fire!'; element.onclick = fire; // this invokes the fire function // element.onclick = 'fire'; // this won't invoke the fire function container.appendChild(element); function fire() { console.log('fired'); }
<div id="container"> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.