在文本上方标记另一个文本
over text mark another text
我正在寻找js代码(可能是jquery),当我过度使用另一个文本时,它会标记一些文本(它们都有相同的ID)
我有很多URL,我想它们上的鼠标会改变表格单元格的颜色
例如:
url1上的overmouse将标记小区ID 20
url2上的overmouse将标记小区ID 18
感谢
为想要突出显示的文本和触发文本创建两个不同的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
更高级的解决方案: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")
});
相关文章:
- 是否可以将一个函数输入连接到另一个函数调用的文本
- 将html元素插入到文本字符串中,以匹配另一个html字符串
- 如何将键入的文本从一个输入类型的文本复制到另一个
- 使用javascript将两个文本框值相加到表中的另一个文本框中
- 在文本上方标记另一个文本
- jQuery将文本从span标记复制到另一个span标记
- 从id标记中的文本进行检查,并将类添加到另一个标记中
- 它在另一个函数中嵌套后不会输出文本
- 如何通过 JS 将内容从一个表单中的一个文本框复制到另一个表单中的另一个文本框
- 使用Javascript从一个文本区域逐行解析.subsr(0,6)到另一个文本区
- 用户在文本框中输入一个数字,并根据使用 PHP 输入的数字重定向到另一个网页
- 如何使用jquery对具有相同类的文本框的值求和并将其放入另一个文本框中
- 使用 jquery 将行值设置为另一个文本
- 从一个文本框执行代码,并在另一个文本框中以 HTML 显示输出
- 内容可编辑-根据类型从一个跨度到另一个跨度克隆文本
- 使用php使用href链接将输入的文本框值传递到另一个页面
- 当文档准备就绪时,将数据从一个文本框复制到另一个
- jQuery-如何使var文本可点击,该文本放置在由更多元素组成的另一个var中(var,checkbox)
- 如何在MVC3剃刀中将文本框值复制到另一个文本框中
- 更改一个文本框的值,与另一个具有比例的文本框值进行比较