求助：jQuery实现表格行点击在新标签页打开PDF文件

我看看你的问题哈——原来的jQuery代码没法实现新标签页打开PDF，主要是这几个小疏漏：

• 选择器错误：原代码里的$("clickable-row")是在找名为clickable-row的HTML标签，但你应该是给行加了这个类名，所以得加上英文句号变成.clickable-row才能选中对应元素。
• 跳转方式错误：window.location是在当前标签页跳转，要打开新标签页得用window.open()方法。
• data属性操作搞反：$(this).data("href", "_blank")是把元素的data-href设置成_blank，这完全不对，我们应该是获取预先存在的data-href值，也就是PDF的链接地址。

修正后的完整jQuery代码 #

<script>
jQuery(document).ready(function($) {
  // 选中所有带clickable-row类的表格行
  $(".clickable-row").click(function() {
    // 获取当前行的PDF链接地址
    const pdfLink = $(this).data("href");
    // 确保链接存在再打开
    if (pdfLink) {
      // 第二个参数"_blank"指定在新标签页打开
      window.open(pdfLink, "_blank");
    }
  });
});
</script>

对应HTML表格的正确写法 #

你需要给可点击的表格行添加clickable-row类，同时用data-href属性存好PDF的链接地址，示例如下：

<table class="tftable" border="0">
  <tr><th>Filer for nedlastning</th></tr>
  <!-- 可点击的下载行示例 -->
  <tr class="clickable-row" data-href="/path/to/your/file1.pdf">
    <td>年度报告.pdf</td>
  </tr>
  <tr class="clickable-row" data-href="/path/to/your/file2.pdf">
    <td>产品手册.pdf</td>
  </tr>
</table>

额外小提示 #

• 确保data-href里的PDF地址是正确的（相对路径或绝对路径都可以）；
• 如果某些表格行不需要点击功能，只要不添加clickable-row类就行；
• 可以给可点击的行加个小样式（比如鼠标变手型），提升用户体验：

.clickable-row {
  cursor: pointer;
}

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