jQuery自定义函数怎么遍历子元素呀-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

jQuery自定义函数怎么遍历子元素呀

<div id="Product_top01-001" class="Product_top01-d1_c1">
 
 <ul class="mainul productlist-01">
 <li class="content column-num1 first">第一个ul的li</li>
 <li class="clearBoth"></li>
 </ul>
 
 <ul class="mainul productslist-02">
 <li class="content column-num1 first">第二个ul的第一个li</li>
 <li class="clearBoth"></li>
 <li class="content column-num1">第二个ul的第二个li</li>
 <li class="clearBoth"></li>
 <li class="content column-num1">第二个ul的第三个li</li>
 <li class="clearBoth"></li>
 <li class="content column-num1 last">第二个ul的最后一个li</li>
 <li class="clearBoth"></li>
 </ul>
 
 </div>

HTML结构就是这样的,因为可能一个页面有多处这样的结构,只是最外围的div的id不一样;所以想写一个自定义的函数来操作。
效果 就是,我想要鼠标移动到包含有 .content 的 li 上就给此li增加一个样式接口(.mouseActive),鼠标移动到其他的li.content的时候包含有(.mouseActive)的li移出(.mouseActive)增加(.mouseout)接口

当鼠标移出div时,最后移开的li.content上要保留(.mouseActive)

展开
收起
a123456678 2016-07-05 16:27:00 1632 0
1 条回答
写回答
取消 提交回答
  • a123456678
    <script language="javascript">
        $(document).ready(function(){
            $("div ul li:.content").bind({
                mouseover:function(){                           
                        $(this).addClass("mouseActive");    
                        $(this).removeClass("mouseOut");
                },
                mouseout:function(){
                    $(this).addClass("mouseOut");   
                    $(this).removeClass("mouseActive");
                     
                    var search_str = $(this).attr("class");
                    if(search_str.indexOf("last") > 0){
                        $(this).addClass("mouseActive");
                        $(this).removeClass("mouseOut");
                    }
                }
            });         
        }); 
    </script>
    2019-07-17 19:51:36
    赞同 展开评论 打赏
问答分类:
相关产品:
问答排行榜
最热
最新
相关课程
更多
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载