Javascript 将变量传递给输入元素中的内联函数

Question

我正在尝试将对象 totalArray 传递到输入元素 id=fullReport 中，以便我能够在函数 printFullReport 中使用变量totalArray。

输入元素连接在一个字符串中，以便最终可以将其创建到一个表中。

我无法将totalArrays传递到onclick =“printFullReport('+totalArray+')”>可能是由于字符串连接，在我的控制台中我收到: “Uncaught SyntaxError:意外的标识符”，这意味着缺少 ;或者 ' 但对我来说似乎很好。

这是我最初的尝试:

<script type="text/javascript">
console.log(totalArray); //{"1":0,"2":0,"3":54700.33,"4":54700.33,"5":0,"6":0,"7":-54700.33,"8":0,"9":0,"10":0};
var str = "";
str += '<td>
<input id ="fullReport"  
class="button" 
type="button" 
value="Full Report" 
    onclick="printFullReport('+ totalArray+ ')">
    TOTAL (GBP):</td>';
</script>

这是我在阅读并遵循最佳答案后的第二次尝试: Inline onclick JavaScript variable

<script type="text/javascript">
var str = "";
console.log(totalArray) //{"1":0,"2":0,"3":54700.33,"4":54700.33,"5":0,"6":0,"7":-54700.33,"8":0,"9":0,"10":0};

function init(){
    document.getElementById('fullReport').onclick=function(){
        printFullReport(totalArray);
    };
}
window.onload=init;

str += '<td><input id ="fullReport"  class="button" type="button" value="Full Report" onclick="init();">TOTAL (GBP):</td>';
</script>

但现在返回:Uncaught ReferenceError:init 未定义。

当 javascript 字符串中有 html 元素时，我可能不理解范围。

Answer 1

第二次尝试时，您缺少结束双引号 "

<script type="text/javascript">

并且您需要从可访问 totalArray 的位置分配 onclick。 (既然您在评论中澄清了 totalArray 不是全局范围的。)

演示

<script type="text/javascript">
var str = "";
totalArray ={ "1":0,"2":0,"3":54700.33,"4":54700.33,"5":0,"6":0,"7":-54700.33,"8":0,"9":0,"10":0};

//console.log(totalArray) //{"1":0,"2":0,"3":54700.33,"4":54700.33,"5":0,"6":0,"7":-54700.33,"8":0,"9":0,"10":0};

function init(){
    document.getElementById('fullReport').onclick=function(){
        printFullReport(totalArray);
    };
}
window.onload=init;

str += '<td><input id ="fullReport"  class="button" type="button" value="Full Report" onclick="init();">TOTAL (GBP):</td>';
</script>

<input id ="fullReport"  class="button" type="button" value="Full Report" onclick="init();">TOTAL (GBP):