將光標懸停在指針上懸停明文像<a>

我想模仿表格單元格中文本的鏈接，將光標更改爲懸停時的指針。我知道真的很容易。將光標懸停在指針上懸停明文像<a>

但它不工作，我想要的方式。

考慮到這個CSS

.pointerCursor {光標：指針;}

如果我用下面的jQuery ...

$("table tbody td").hover(
    function(){$(this).addClass('pointerCursor');}, 
    function(){$(this).removeClass('pointerCursor');} 
);

...顯然光標更改爲每個整個單元格框中的指針，因此也是整個表格。

是否有一個jQuery選擇，讓我改變光標懸停時只文在單元格，模仿的<a>鏈接，讓表的其餘部分保持默認光標？

來源

2014-12-19 Rodrigo

你在每個'td' _only_文本？ – Rhumborl 2014-12-19 00:32:12

您將需要將文本包裝在內容中 - 不能直接定位文本內容。

您可以使用jQuery來獲取在this answer描述的文本節點，然後用你的類wrap()他們span S：

$('td').contents().filter(function() { 
 
     return this.nodeType === 3; 
 
}).wrap('<span class="pointerCursor" />');

td { 
 
    width:200px; 
 
    height:200px; 
 
    border:1px solid #000; 
 
} 
 

 
.pointerCursor{ 
 
    cursor:pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
     <td>Text 1</td> 
 
     <td>Text 2</td> 
 
    </tr> 
 
</table>

來源

2014-12-19 00:39:20 Rhumborl

它完美的作品。 – Rodrigo 2014-12-19 00:45:42

我會通過純CSS做到這一點：

table tbody td:hover { 
    cursor: pointer; 
}

請評論，如果您需要一個純JavaScript解決方案

編輯：重新閱讀你的問題，我想你在找什麼正在改變不是空的單元格上的光標？

td:hover:not(:empty) { 
    cursor: pointer; 
}

來源

2014-12-19 00:33:29 Vince

不是在整個單元格上，而只在單元格中的文本上。不管怎麼說，還是要謝謝你！ – Rodrigo 2014-12-19 00:44:23

將光標懸停在指針上懸停明文像<a>

回答

相關問題