Javascript 如何使整个td成为链接？

如何使整个td成为链接

<td id="blue-border"><span id="blue"></span></td>

单击td应该使其行为如下（我知道这在语法上是不正确的：

<a href="javascript:chooseStyle('blue-theme', 360)"> <td id="blue-border"><span id="blue"></span></td> </a>

---

编辑：到目前为止，所有建议都只是将td内的跨度作为链接，帮助lol。

为td定义一个OnClick事件：

<td id="blue-border" onclick="chooseStyle('blue-theme', 360)">...

。。。

您不能将td包装在锚中。请执行以下操作：

<td id="blue-border"><a href="javascript:chooseStyle('green-theme', 360)"> <span id="blue"></span></a></td> 

或

---

在td内添加锚定标签，并将其显示属性设置为block。这将使整个td可点击

#blue-border a{
    display: block;
}

或

使用CSS

<style type="text/css">
td a { display: block; width: 100%; height: 100%; }
</style>

<td><a href="#">Link</a></td>

td a{显示：块；宽度：100%；高度：100%；}

---

CSS强制链接扩展到TD的全宽和全高。

如果您所做的只是启动javascript，我建议首先使用

onclick

而不是锚定标记，如：

<td id="cell123" onclick="chooseStyle('green-theme',360)">cell contents</td>

jQuery代码：

$(document).ready(function(){
    var tdLink = $('#tdBlue');

    tdLink.click(function(){
         alert('blue-theme');
    });
});

选中此处：

将jquery与类一起使用

$（“tr td.data\u col”）。单击（函数（）{
window.location=$（this.find（'a'）.attr（“href”）；
})

当你这样做时会发生什么？@LedZeppelin这里有一个演示：…你的代码可能有很多地方出了问题。你有链接吗？当td的高度被明确指定时，这是有效的，但当它由行中的其他东西决定时，它就不起作用了，很显然：你想做什么？为什么表格单元格必须是可链接的？

<td id="cell123" onclick="chooseStyle('green-theme',360)">cell contents</td>

#cell123:hover { cursor: pointer; }

<table width="100%" class="blueCss">
    <tr>
        <td ID="tdBlue">
            <span id="Blue">Hello</span>
        </td>  
        <td>
            <span>other col</span>
        </td>
     </tr>
</table>

.blueCss {
        height: 100px;
        width: 100px;
    }

    .blueCss td {
        background-color: blue;
    }

    .blueCss:hover    {
        border-color: #00ae00;
    }

    .blueCss td:hover    {
        background-color: yellow;
        cursor: pointer;
    }

$(document).ready(function(){
    var tdLink = $('#tdBlue');

    tdLink.click(function(){
         alert('blue-theme');
    });
});