将数组中的 HTML 表格的一列设为可点击的 URL

Posted 2023-05-07

【中文标题】将数组中的 HTML 表格的一列设为可点击的 URL

【英文标题】：Make one column of an HTML table from array a clickable URL

【发布时间】：2021-05-31 21:25:00

【问题描述】：

我正在使用 Google App Script 生成一个 html 数据表，并试图让 URL 结果可点击。

我应该在哪里添加这个？ 它应该是另一个函数吗？

 function createTable(dataArray) 
    if(dataArray)
      var result = "<table class='table table-sm' style='font-size:0.8em'>"+
                   "<thead style='white-space: nowrap'>"+
                     "<tr>"+                               
"<th scope='col'>Name</th>"+
"<th scope='col'>URL</th>"+
"<th scope='col'>Type</th>"+
                    "</tr>"+
                  "</thead>";
      for(var i=0; i<dataArray.length; i++) 
          result += "<tr>";
          //result += "<td><button type='button' class='btn btn-danger btn-xs deleteBtn' onclick='deleteData(this);'>Delete</button></td>";
          result += "<td></td>";
          result += "<td><button type='button' class='btn btn-warning btn-xs editBtn' onclick='editData(this);'>Edit</button></td>";
          for(var j=0; j<dataArray[i].length; j++)
              result += "<td>"+dataArray[i][j]+"</td>";
          
          result += "</tr>";
      
      result += "</table>";
      var div = document.getElementById('dataTable');
      div.innerHTML = result;
      document.getElementById("message").innerHTML = "";
    else
      var div = document.getElementById('dataTable');
      div.innerHTML = "Data not found!";
    
  

【参考方案1】：

您可以将tag A 添加到您的元素中，使其能够点击的href 标记（添加target="_blank" 以使URL 在新标签中打开）

【讨论】：

感谢您的回答，当我将其添加到代码中时，它会使整行成为一个链接：result += "

google.com'>"+dataArray[i][j]+"</a></…>";我怎样才能做到这一点，a）只有 URL 值被制作成一个链接，b）将每行的不同 URL 传递到静态示例现在所在的位置？

标签 'tr' 适用于每一行，标签 'td' 适用于 'tr' 行中的每一列 所以。如果要单击行重定向到另一个 URL，则需要将 onclick 设置为 标记，它将是表中的整行，但如果设置为 标记，它将仅用于该列。 是指将标签 分配给标签 我建议您阅读以下内容：w3schools.com/html/html_tables.aspw3schools.com/jsref/event_onclick.asp