如何在字符串中传递字符串？解决onclick参数无引号失效问题

你遇到的问题太常见了——直接把字符串值拼到内联onclick事件里时，没给字符串加引号，JS会把my stuff当成变量名而非字符串，自然就报错失效了。这里给你几个实用的解决办法：

方法1：拼接时给参数添加引号（转义处理） #

你需要在生成HTML时，给table.rows[i].c[2].v的值包裹引号，同时注意外层引号的转义。比如用模板字符串（ES6+）会更清爽，避免转义的麻烦：

`<td>${table.rows[i].c[0].v}<a href="#" onclick="loadForm('${table.rows[i].c[2].v}')">&nbsp;&nbsp;My Link</a></td>`

这样生成的HTML会是：

<a href="#" onclick="loadForm('my stuff')">&nbsp;&nbsp;My Link</a>

JS就能正确识别'my stuff'是字符串参数了。如果用传统字符串拼接，记得转义内部引号：

"<td>"+table.rows[i].c[0].v+"<a href='#' onclick='loadForm(\""+table.rows[i].c[2].v+"\")'>&nbsp;&nbsp;My Link</a></td>"

方法2：避免内联事件绑定（更推荐） #

内联onclick不仅容易踩引号的坑，还不利于代码维护。更规范的做法是动态创建元素，用addEventListener绑定事件：

// 创建td元素
const td = document.createElement('td');
td.textContent = table.rows[i].c[0].v;

// 创建a标签
const link = document.createElement('a');
link.href = '#';
link.innerHTML = '  My Link';

// 绑定点击事件，直接传递字符串参数
link.addEventListener('click', () => {
  loadForm(table.rows[i].c[2].v);
});

// 把a标签加入td，再把td插入表格
td.appendChild(link);
// 这里记得把td添加到对应的表格行中

这种方式完全不用处理引号转义，代码逻辑也更清晰。

方法3：用data属性存储参数 #

如果还是想用内联写法，可以把参数存在a标签的data-*属性里，点击时读取：

"<td>"+table.rows[i].c[0].v+"<a href='#' data-content='"+table.rows[i].c[2].v+"' onclick='loadForm(this.dataset.content)'>&nbsp;&nbsp;My Link</a></td>"

生成的HTML会是：

<a href="#" data-content="my stuff" onclick="loadForm(this.dataset.content)">&nbsp;&nbsp;My Link</a>

通过this.dataset.content直接获取字符串，也能避开引号问题。

内容的提问来源于stack exchange，提问作者dukenukem6487