gpt4 book ai didi

javascript - 当鼠标悬停在图像上时,如何使文本出现在页面上的设定位置

转载 作者:行者123 更新时间:2023-11-30 05:31:29 25 4
gpt4 key购买 nike

我通读了类似的答案,但无法弄清楚如何编辑它们以使用我自己的 html。我有一个表格,一旦鼠标悬停在表格中的某个单元格上,文本就会出现在页面右侧的白色框中。如果有人知道如何最好地使用 Javascript(但任何有用的东西都会有所帮助)来解决这个问题,那就太好了。这是我的表格代码片段,我要执行上述事件的单元格有一个 ID="blue1"

<tr>
<td>1</td>
<td id="blue1">
2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>

这是我希望文本出现的框:

<div id="whitebox">

<script type= text/javascript>


</script>
</div>

这是我希望在#blue1 悬停时出现在#whitebox 中的文本 -

《2点第二次见约翰》

我已经摆弄了各种代码,但无法让它工作。

最佳答案

你必须 catch .hover()事件并使用 .text() 附加文本.

$('#blue1').hover(function() {
$('#whitebox').text('2nd Meet John at 2');
}, function() {
$('#whitebox').text('whitebox');
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<table>
<tr>
<td>1</td>
<td id="blue1">
2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
</table>

<div id="whitebox">
whitebox
</div>

脚本可以放在<head> ... </head>中网站部分使用:

<script type="text/javascript">
$(document).ready(function() {
// script
});
</script>

关于javascript - 当鼠标悬停在图像上时,如何使文本出现在页面上的设定位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26698654/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com