JS第二篇：jquery实现标签hover动态变化的效果

最新推荐文章于 2023-05-11 21:18:33 发布

踩坑又填坑

最新推荐文章于 2023-05-11 21:18:33 发布

阅读量1.5k

点赞数

分类专栏： js相关知识文章标签： hover

本文链接：https://blog.csdn.net/zhangtao0417/article/details/99448169

版权

js相关知识专栏收录该内容

4 篇文章 0 订阅

订阅专栏

1.下面是简单的jq hover

$('td').hover(function() {
      // 鼠标移入时添加hover类
      // code
    }, function() {
      // 鼠标移出时移出hover类
      //code
  });

2.嵌套hover不能写在一起，要分开

$('td').hover(function() {
      // 鼠标移入时添加hover类
      var index = $(this).data('id');
      hoverItem(index)
      
    }, function() {
      // 鼠标移出时移出hover类
      
  });
  function hoverItem(index){
  $('#started'+index).hover(function() {
      // 鼠标移入时添加hover类
      $('#started'+index).removeClass('btn-gray')
      $('#started'+index).addClass('btn-red')
      $('#started'+index).text('停止')
    }, function() {
      // 鼠标移出时移出hover类
      $('#started'+index).removeClass('btn-red')
      $('#started'+index).addClass('btn-gray')
      $('#started'+index).text('已启动')
  });
}