tdにリンクを張るには？

Question

このリンク全体をリンクにするにはどうすればよいですか？笑すべての提案が唯一のTDリンク内のスパンを作っているこれまでのところ、助ける：

は

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

EDIT：

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

クリックtdが、それは私が、これは文法的に間違っている知っている（このように動作させる必要があります。

Answer 1

使用CSS。

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

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

CSSはリンクを強制的にTDの全幅と高さに拡張します。

Answer 2

TDのonclickイベントを定義します。

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

Answer 3

あなたがでTDをラップすることはできませんアンカー。このください：

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

それとも

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

Answer 4

は、TDの内側にアンカータグを追加し、ブロックするための表示属性を設定します。これにより、td全体をクリック可能にする必要があります。

#blue-border a{ 
    display: block; 
} 

または

<a href="link" style="display:block;"> 

Answer 5

あなたがやっているすべてはJavaScriptを発射した場合のように、私は、最初の場所で代わりにアンカータグのonclickを使用することをお勧めしたい：あなた場合は、そこに簡単なCSSスタイルを投げることができる

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

マウスポインタになりたい：

#cell123:hover { cursor: pointer; } 

Answer 6

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

CSSファイル：

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

    .blueCss td { 
     background-color: blue; 
    } 

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

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

のjQueryコード：ここ

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

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

チェック：クラスとjsFiddle.net

Answer 7

使用jqueryの
$("tr td.data_col").click(function() { window.location = $(this).find('a').attr("href"); });