onclick 事件上的转义参数不起作用答案

【问题标题】：escape parameters on onclick event doesnt workonclick 事件上的转义参数不起作用
【发布时间】：2015-12-08 04:00:34
【问题描述】：

我正在 atm 将动态表格放入 html 页面中，每个表格行的第一列上都有一个按钮来显示项目的描述（它是一个项目列表）。

但是，当使用 onclick 事件设置 innerhtml 时，我无法触发警报。当我想调用另一个 JS 函数来调用警报并尝试在我的 onclick 函数中传递参数时，尝试时它不会执行任何操作逃避引号没有任何作用。

Javascript

function showAuctionList(auctionList){
  var table = document.getElementById("myTableData");

  for(var i = 0 ; i< auctionList.length ; i++){
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    var description = auctionList[i].itemDesc;

    row.insertCell(0).innerHTML= '<input type="button" value = "Show Description" onclick="showDescription( description)">';
    row.insertCell(1).innerHTML= auctionList[i].auctionId;
    row.insertCell(2).innerHTML= auctionList[i].sellId;
    row.insertCell(3).innerHTML= auctionList[i].startDate;
    row.insertCell(4).innerHTML= auctionList[i].endDate;
    row.insertCell(5).innerHTML= auctionList[i].buyNow;
    row.insertCell(6).innerHTML= auctionList[i].minBid;
    row.insertCell(7).innerHTML= auctionList[i].actualBid;
    row.insertCell(8).innerHTML= auctionList[i].itemCat;
    row.insertCell(9).innerHTML= auctionList[i].itemName;
    row.insertCell(10).innerHTML= auctionList[i].itemDesc;
  }
}

function showDescription(desc){
  alert(desc);
}

HTML

  <div id="search" style="display:none">
  <button id="searchButton" onclick="


google.script.run.withSuccessHandler(showAuctionList).getAuctionList()"> Search </button> <br>
  <div id="mydata">
    <table id="myTableData"  border="1" cellpadding="2">
      <tr>
        <td>&nbsp;</td>
        <td><b>Auction ID</b></td>
        <td><b>Seller ID</b></td>
        <td><b>Start Date</b></td>
        <td><b>End Date</b></td>
        <td><b>Buy now option</b></td>
        <td><b>Min Bid</b></td>
        <td><b>Actual Bid</b></td>
        <td><b>Category</b></td>
        <td><b>Item Name</b></td>
        <td><b>Description</b></td>
     </tr>
    </table>
    &nbsp;<br/>
</div>

gs 函数调用：

 function doget(e){
   ...
   return HtmlService.createTemplateFromFile('Main').evaluate().setSandboxMode(HtmlService.SandboxMode.IFRAME);
 }

如果描述作为参数起作用，或者有什么解决方法可以解决这个问题？其余的工作都很好

【问题讨论】：

提供的示例不完整..如何为您的代码创建可执行环境？
description 没有引用“showDescription(description)”中的任何内容。因此代码在后台静默失败。
@magreenberg 井描述包含带有项目信息的字符串。我知道描述不涉及我的问题，我想将 onclick 事件中的变量描述作为参数传递给调用警报方法
@DavidBizer 只是将字符串与 + 运算符连接在一起。 onclick="showDescription("+description+")"

标签： javascript html onclick innerhtml

【解决方案1】：

试试这个。由于描述似乎是 string 值，您需要将 surround 与 qoutes 一起使用。

row.insertCell(0).innerHTML = '<input type="button" value = "ShowDescription"  onclick="showDescription(\'' + description + '\');">';

【讨论】：

为了更准确，您不需要在单引号内转义双引号。
在这种情况下，为了保持一致，您也需要转义其他引号（type="button" value = "ShowDescription"）
@MairajAhmad 谢谢。我试过了，但是没有用，什么也没发生。如果我在没有参数的情况下在 onclick 上调用 showdescription 它工作正常。描述参数也是正确的。
@DavidBizer 请检查现在我已经更新了答案。
@TareqMahmood 我删除了双引号的转义。

【解决方案2】：

如果使用此代码，则无需转义：

row.insertCell(0).innerHTML= '<input type="button" value = "Show 
Description" onclick="showDescription(this.getAttribute(\'description\'))">';
row.cells[0].firstChild.setAttribute('description', description);

【讨论】：