关于JS鼠标离开恢复原来单元格的格式

//鼠标经过

$(".x-table tr").mousemove(function() {

//所在行背景色:红色

        $(this).css("background-color","#6cc1f9");

//所在行单元格字体:18px

        $(this).find("td").css("font-size","18px");

});

//鼠标点击

$(".x-table tr").mousedown(function() {

//所在行背景色:黄色

        $(this).css("background-color","yellow");

//所在行单元格字体:18px        

        $(this).find("td").css("font-size","18px");

});

//鼠标离开

$(".x-table tr").mouseout(function() {

//所在行背景色:白色

        $(this).css("background-color","white");

//所在行单元格字体:12px 

       $(this).find("td").css("font-size","12px");

});


想问一下鼠标离开怎么恢复到原来字体大小原来背景色，怎么写，一定是恢复到原生态的时候，因为每行字体大小都不一样。

比如：我原来字体大小是15，鼠标移到这行变成18，移走之后还要变成15，现在是移走就变成12了
FineReport 小田 发布于 2019-7-10 09:52 （编辑于 2019-7-10 10:09）
1min目标场景问卷 立即参与
回答问题
悬赏：4 F币 + 添加悬赏
举报
提示：增加悬赏、完善问题、追问等操作，可使您的问题被置顶，并向所有关注者发送通知
共4回答
最佳回答
0
小田Lv5见习互助
发布于2019-7-10 13:32

已经解决了，这是我写的

var $lasttd;//上一个行变量

var lastcolor;//上一次颜色变量

var typeface;//上一次字体大小变量

$(".x-table tr").mousemove(function() {

if($lasttd){

$lasttd.css('background',lastcolor);

$lasttd.find("td").css("font-size",typeface);

}//离开后原单元格恢复原色和字体

lastcolor=$(this).css('background-color');

typeface=$(this).find("td").css("font-size");

if(!lastcolor)

lastcolor=$(this).css('background');//保存原始颜色

$(this).css('background','#f0dad2');//设置当前单元格为红色

if(!typeface)

typeface=$(this).find("td").css("font-size");//保存原始字体大小

$(this).find("td").css("font-size","18px");//设置当前单元格字体大小为18

$lasttd=$(this);//保存上一个单元格

}); 
举报 收起评论(1)
  • doudekaixin doudekaixin 怎么你的所有问题最佳都是自己。。 而且我感觉你这段代码貌似有问题。貌似实现不了你的效果。
    2019-07-10 14:53 
最佳回答
0
doudekaixinLv6中级互助
发布于2019-7-10 09:55（编辑于 2019-7-10 10:20）

把12px改成15pximage.png
举报 收起评论(7)
  • 小田 小田(提问者) 我把这行删掉的效果是鼠标移动上面字体变大，鼠标移走的时候就不变小了
    2019-07-10 10:04 
  • 小田 小田(提问者) 移走还是变大的效果，就不动了
    2019-07-10 10:04 
  • doudekaixin doudekaixin 回复 小田(提问者) 你把你的CPT带数据传上来。
    2019-07-10 10:15 
  • doudekaixin doudekaixin 回复 小田(提问者) 你的字号是15，那你把12px改成15px
    2019-07-10 10:19 
  • 小田 小田(提问者) 回复 doudekaixin 每行的字体大小都不一样，不能设置固定的大小，要移走恢复到原来字体
    2019-07-10 10:24 
最佳回答
0
Kevin-sLv7中级互助
发布于2019-7-10 10:11（编辑于 2019-7-10 10:12）

//鼠标经过

$(".x-table tr").mousemove(function() {

//所在行背景色:红色

        $(this).css("background-color","#6cc1f9");

//所在行单元格字体:18px

        $(this).find("td").css("font-size","18px");

});

//鼠标点击

$(".x-table tr").mousedown(function() {

//所在行背景色:黄色

        $(this).css("background-color","yellow");

//所在行单元格字体:18px        

        $(this).find("td").css("font-size","18px");

});

//鼠标离开

$(".x-table tr").mouseout(function() {

//所在行背景色:白色

        $(this).css("background-color","white");

//所在行单元格字体:12px 

       $(this).find("td").css("font-size","15px");

});


你将这段代码复制进去，将12改成15就可以了，如果你要回到原来背景色，只要把white改成原来的颜色就可以了
举报 收起评论(2)
  • 小田 小田(提问者) 你这还是不行，如果原来字体，有的行是13，有的行是15，原来13的也变成15了
    2019-07-10 10:19 
  • Kevin-s Kevin-s 回复 小田(提问者) 那你只能给13的单元格和15的单元格分别设置，毕竟你点击的时候已经把字体大小给改变，你需要重新设置字体大小才能变回来，所以楼主，应该只能分开设置
    2019-07-10 10:22 
最佳回答
0
KerydiaLv5中级互助
发布于2019-7-10 10:41

直接在单元格写H5

<span onmouseover="this.style.color='red'" onmouseout="this.style.color='white'"   >金额</span>

类似上面，写完之后要选择一下用HTML显示内容

image.png
举报 收起评论(1)
  • 3关注人数
  • 610浏览人数
    • 最后回答于：2019-7-10 13:32
    活动推荐 更多
    热门课程 更多
    请选择关闭问题的原因
    确定 取消
    隐私政策
    帆软用户服务协议
    联系管理员
    联系帆软
    Copyright© 帆软软件有限公司 版权所有
    苏ICP备18065767号
    返回顶部