-3

我正在寻找 js 代码（可能是 jquery），当我在另一个文本上过度鼠标时会标记一些文本（它们都将具有相同的 ID）

我有许多 URL，我希望它们上的过度鼠标会改变表格单元格的颜色

例如：

url1 上的 overmouse 将标记单元格 ID 20

url2 上的 overmouse 将标记单元格 ID 18

谢谢

4

2 回答 2

0

为要突出显示的文本和触发文本创建 2 个不同的 ID：

<span id="part1_text" class="class">my text</span> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed dapibus risus at est sollicitudin vulputate. Quisque tristique velit nec lorem consequat non placerat nibh iaculis.

<br /><br />

<span id="text">hover me</span>​

使用hover：

$('#text').on('hover', function(){
    var nextId = '#part1_'+$(this).attr('id');
    $(nextId).toggleClass('class2');
});
​

JSFiddle

于 2012-09-04T10:43:08.353 回答
0

更高级的解决方案：http: //jsfiddle.net/ggDzw/4/

<table border="1">
    <tr> 
        <td id="cell20">CELL 20</td>
        <td id="cell201">CELL 201</td>
    </tr>
    <tr>
        <td id="cell300">CELL 300</td>
        <td id="cell301">CELL 301</td>
    </tr>
    <tr>
        <td id="cell18">CELL 18</td>
        <td id="cell181">CELL 181</td>
    </tr>
</table>
<h1>
<a id="url1" href="http://www.9gag.com/">URL 1</a><br>
<a id="url2" href="http://www.giorgiacosplay.com/">URL 2</a>
</h1>
​
function URLtoCellHighlight(urlID, cellID) {

$("#" + urlID).hover(

function() {
    $("#" + cellID).addClass("highlight")
}, function() {
    $("#" + cellID).removeClass("highlight")
        });
}

    URLtoCellHighlight("url1", "cell20");
    URLtoCellHighlight("url2", "cell18");
​
.highlight { background-color: yellow }
h1 { color: red }
​

这是 SPAN 的基本示例

http://jsfiddle.net/ggDzw/

<span id="text1">TEXT 1</span>
<span id="text2">Other Text</span>
​
.highlight { background-color: yellow }​

$("#text2").hover(
function() {
    $("#text1").addClass("highlight")
}, function() {
    $("#text1").removeClass("highlight")
});​
于 2012-09-04T10:41:45.907 回答