美文网首页
实现切换tabs

实现切换tabs

作者: 一枚小菜 | 来源:发表于2020-06-10 15:45 被阅读0次

    实际上就是操作dom元素然后更改其样式,隐藏或显示

    //  8. 点击切换产品选项 (商品详情等显示出来)
        function showtabs() {
          var $lis = $('#product_detail>ul>li')
          var $con = $('#product_detail>div:gt(0)')
          $lis.click(function () {
            $lis.removeClass('current')
            // this.className = 'current'//原生写法,this是dom对象
            $(this).addClass('current')//jQuery写法,$(this)是jQuery对象
            $con.hide()
            var index = $(this).index()
            // $con[index].style.display = 'block'//原生写法,$con[index]是dom对象
            $con.eq(index).show()//jQuery写法,$con是jQuery对象
          })
        }
    
    tabs

    相关文章

      网友评论

          本文标题:实现切换tabs

          本文链接:https://www.haomeiwen.com/subject/iyvbtktx.html