javascript - 表格行点击 - 两个目的地

标签 javascript html css

我想让整个表格行都可以点击,包括空格。我已经看到了使用 JavaScript 和 TR 上的点击处理程序来执行此操作的方法,或者只是将每个 TD 设置为 display:block。

皱纹是我还希望在链接到其他地方的行中有一些文本,但不会触发该行的整个其余部分的基础链接。本质上,这个特殊的文本就像一个“徽章”。

像这样:

T = Text
B = Badge
W = Whitespace

行中的单个单元格可能如下所示:

TTTTT BB WWWWWWWWWWWWWWWWWWW

点击 T 和 W 将转到一个链接,这是通常的情况。 但是单击 B 会在新窗口中打开一个不同的链接,并且不会在主窗口中打开原始链接。

寻找正确方向的指针,是否可以用纯 HTML/CSS 或 JavaScript 等来完成。谢谢,

最佳答案

您可以使用 A 元素进行导航,然后如果某行点击了某个元素,则忽略它。

<tr onclick="doSomething(event);">
  <td>
    <a href="…">TTTTT</a><a href="…">BB</a>WWWWWWWWW…


function doSomething(evt) {
  var tgt = evt.target || evt.srcElement;
  if (tgt && tgt.tagName.toLowerCase() == 'a' && tgt.href) {
    // don't do click action
    return;
  } 
  // do click action
}

哦,不要制作 TRs display: block 因为它们应该是 display: table-cell

关于javascript - 表格行点击 - 两个目的地,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10082215/

相关文章:

javascript - 选择选项组中的一个选项

javascript - 如何强制加载页面上的每个元素?

html - 元素周围的部分圆形边框

css - 我如何破解 GWT 主题中可用的样式?

html - 如何将元素对齐到 div 框的右侧?

javascript - 从 JS 文件将 Chart.js 折线图添加到 Jinja2/Flask html 页面

javascript - 如何忽略正则表达式中 URL 周围的字符

javascript - 计算列的时间总和

ajax - RecorderJS 通过 AJAX 上传记录的 blob

html - 将 div 与图像水平对齐,并能够水平滚动它们