Question

我有一个将html推送到数组的函数，当它完成时它会返回html，并且使用jQuery的.html将html推送到另一个函数的dom。

推送html的函数有一个参数，其中包含一个在单击表时应该调用的方法。

但是当我尝试使用onclick时，它将我的函数呈现为字符串（函数的全部内容）。

我做错了什么？

function GenerateTapHeader(TabName, clickCallbackFunction) {
    var tmpTapHeaderHTML = new Array();

    tmpTapHeaderHTML.push('<table id="Table_' + TabName + '" class="TapHeader" onclick="' + clickCallbackFunction + '">');
    tmpTapHeaderHTML.push('<tr>');
    tmpTapHeaderHTML.push('<td></td><td></td>');
    tmpTapHeaderHTML.push('<td><span></span></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('<td><div>' + TabName + '</div></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('</tr>');
    tmpTapHeaderHTML.push('</table>');

    return tmpTapHeaderHTML.join('');
}

Answer 1

你不能这样做，因为在全局范围内必须有一个引用来运行onclick函数，说你有

<a oncklick="runme()">runme()</a>

你必须在全局范围（窗口）中存在函数runme 所以你必须这样做（clickCallbackFunctionName必须是一个包含你要调用的函数的NAME的字符串）：

function GenerateTapHeader(TabName, clickCallbackFunctionName) {
    var tmpTapHeaderHTML = new Array();

    tmpTapHeaderHTML.push('<table id="Table_' + TabName + '" class="TapHeader" onclick="' + clickCallbackFunctionName + '();">');
    tmpTapHeaderHTML.push('<tr>');
    tmpTapHeaderHTML.push('<td></td><td></td>');
    tmpTapHeaderHTML.push('<td><span></span></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('<td><div>' + TabName + '</div></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('<td></td>');
    tmpTapHeaderHTML.push('</tr>');
    tmpTapHeaderHTML.push('</table>');

    return tmpTapHeaderHTML.join('');
}

Answer 2

等到将表格添加到dom后再执行以下操作：

$('#Table_' + TabName).click(function(){
    clickCallbackFunction();
});

在dom之前创建onClick事件

2 个答案: