javascript - 在函数之后用字符串转义jquery中的引号

Question

有点难以解释，我正在使用 .after() jquery 函数将 html 放入 div 容器中，然后在其中一个标记中有一个 onclick 属性来调用传入字符串的函数(javascript变量)，但此变量需要用引号引起来才能使 javascript 函数正常工作:

请注意，after 函数似乎将 html 属性的单引号替换为双引号？

$("#outputsContainer tr:last").after(
    "<tr>\
       <td>"+value.name+"</td>\
       <td>"+value.status+"</td>\
       <td>\
          <a href='" + value.delete + "' onclick='" + myfunction(value.status) + "'>Delete</a>\
          <a href='" + value.download + "'>Download</a>\
       </td>\
    </tr>");

我已经设法在函数中获取变量值，但似乎无法轻易地在它周围放置引号

输出:

<a href="/item/4/download" onclick="myfunction(complete)">Download</a>

我想要的(注意 complete 周围的引号):

<a href="/item/4/download" onclick="myfunction('complete')">Download</a>

感谢帮助，谢谢!

Answer 1

尝试在 JavaScript 中将一个 javascript 字符串连接成一个 HTML 字符串只会给您一个难以维护的大字符串。

分解问题。使用现有的 DOM 功能来帮助您。

var row = jQuery('<tr>');

var name_cell = jQuery('<td>');
name_cell.text(value.name);
row.append(name_cell);

var status_cell = jQuery('<td>');
name_cell.text(value.status);
row.append(status_cell);

var links_cell = jQuery('<td>');

var delete_link = jQuery('<a>');
delete_link.attr('href', value.delete);
delete_link.on('click', function () {
    myfunction(value.status);
});
delete_link.text('Delete');
links_cell.append(delete_link);

var download_link = jQuery('<a>');
download_link.attr('href', value.download);
download_link.text('Download');
links_cell.append(download_link);

$("#outputsContainer tr:last").after(row);