使用javascript编写HTML脚本时出现语法错误
使用javascript编写HTML脚本时出现语法错误
提问于 2018-08-12 07:06:03
我有以下试图动态插入HTML代码的javascript代码。我有一个错误的语法，但我不知道如何纠正它。有没有人能给点建议？
loadNextContainer.innerHTML = '<span class="sr_43" id="srloadnext_2" onclick="srt.loadNextMatchRecords(\''+numDownloadSoFar+'\', \''+maxDownloadLimit+'\', \''+folderName+'\', \''+jsonHashTags+'\', \''+fromDate+'\', \''+toDate+'\', \''+lastScanId+'\')">LoadNext</span>';错误消息：
Uncaught SyntaxError: Invalid or unexpected token我相信错误是围绕着函数变量而产生的。特别是JSON变量。我不能为JSON中的每个元素更改双引号的使用。因此，这必须停留在任何解决方案中。
回答 3
Stack Overflow用户
回答已采纳
发布于 2018-08-12 07:30:58
从您的变量图像判断，没有一个template literal解决方案对您有帮助，因为您的参数中至少有一个是数组。
是的，只要付出足够的努力，就有可能将该数组转换为可与innerHTML一起使用的字符串表示。但这将是非常困难的。最后，您至少需要使用JSON.stringify来获取数组的字符串版本。
一个更简单的解决方案实际上是创建元素，然后通过纯javascript添加onclick操作符，如下所示：
var s = document.createElement('span');
s.className = 'sr_43';
s.id = 'srloadnext_2';
s.innerText = 'LoadNext';
loadNextContainer.appendChild(s);
s.onclick = function(e) {
srt.loadNextMatchRecords(numDownloadSoFar, maxDownloadLimit, folderName, jsonHashTags, fromDate, toDate, lastScanId);
};Stack Overflow用户
发布于 2018-08-12 07:24:31
您可以尝试使用像这样的反引号。
loadNextContainer.innerHTML = `<span class="sr_43" id="srloadnext_2" onclick="srt.loadNextMatchRecords('`+numDownloadSoFar+`', '`+maxDownloadLimit+`', '`+folderName+`', '`+jsonHashTags+`', '`+fromDate+`', '`+toDate+`', '`+lastScanId+`')">LoadNext</span>';或者只是转义双引号而不是单引号。这样做，当您试图转义字符串时，您无意中打开了字符串。
loadNextContainer.innerHTML = "<span class=\"sr_43\" id=\"srloadnext_2\" onclick=\"srt.loadNextMatchRecords('"+numDownloadSoFar+"', '"+maxDownloadLimit+"', '"+folderName+"', '"+jsonHashTags+"', '"+fromDate+"', '"+toDate+"', '"+lastScanId+"')\">LoadNext</span>";Stack Overflow用户
发布于 2018-08-12 07:27:56
尝试使用模板文字：
loadNextContainer.innerHTML = `<span class="sr_43" id="srloadnext_2" onclick="srt.loadNextMatchRecords(\'${numDownloadSoFar}\', \'${maxDownloadLimit}\', \'${folderName}\', \'${jsonHashTags}\', \'${fromDate}\', \'${toDate}\', \'${lastScanId}\')">LoadNext</span>`;编辑:正如其他人已经提到的。抱歉的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/51804446
复制相关文章
相似问题