生成具有动态内容的字符串

Question

我有一个像下面这样的字符串，var markup = "<p class='error-info-popup-link' onclick='processData.getErrorInfoPopup("+helper.qaConstants[item.errors[i]]+", "+item.source+", "+ seqNo +")'> Info </p>"上面的字符串输出是：-<p class="error-info-popup-link" onclick="processData.getErrorInfoPopup(Numeric Mismatch, 1, 2)"> Info </p>我想要以下输出：-<p class="error-info-popup-link" onclick="processData.getErrorInfoPopup('Numeric Mismatch', 1, 2)"> Info </p>我该怎么办？

Answer 1

只需添加转义引号：

var markup = "<p class='error-info-popup-link' onclick='processData.getErrorInfoPopup(\""+helper.qaConstants[item.errors[i]]+"\", "+item.source+", "+ seqNo +")'> Info </p>"

或者使用模板：

var markup = `<p class='error-info-popup-link' onclick='processData.getErrorInfoPopup("${helper.qaConstants[item.errors[i]]}", ${item.source}, ${seqNo})'> Info </p>`

Answer 2

我个人会说完全绕过这个问题并避免内联绑定。

var newP = document.createElement('p');

newP.classList.add('error-info-popup-link');

newP.innerText = ' Info ';

newP.addEventListener('click', function(){

  processData.getErrorInfoPopup(

    helper.qaConstants[item.errors[i]],

    item.source,

    seqNo

  );

});