zoukankan      html  css  js  c++  java
  • 点击增加类名点击删除类名

    点赞收藏

    <footer class="aui-bar aui-bar-tab " id="footer">
      <div class="aui-bar-tab-item" id="laud_btn" style=" 2.2rem;" tapmode onclick="fnlaud()">
        <i class="aui-iconfont aui-icon-laud"></i>
      </div>
      <div class="aui-bar-tab-item" id="like_btn" style=" 2.2rem;" tapmode onclick="fnlike()" >
        <i class="aui-iconfont aui-icon-like"></i>
      </div>
    </footer>

    // 点赞
    function fnlaud(){
    var item = document.getElementById("laud_btn");

    //判断有没有laud-active

    //先移除后增加

    if(item.className.indexOf('laud-active') > -1){         
      item.classList.remove('laud-active');
    }else{
      item.classList.add("laud-active");
    }
    }
    // 收藏
    function fnlike(){
    var item = document.getElementById("like_btn");
    if(item.className.indexOf('laud-active')> -1){
    item.classList.remove('laud-active');
    }else{
    item.classList.add("laud-active");
    }
    }

     点赞不是切换,需要用两个方法

    tab

    <div class="aui-tab aui-tab-content" id="tab">
      <div class="aui-tab-item "><div class="tit-in aui-active" tapmode onclick="newsgroupeOn(0,this)">我的评论与回复</div></div>
      <div class="aui-tab-item "><div class="tit-in" tapmode onclick="newsgroupeOn(1,this)">收到的评论<span class="dot"></span></div></div>
      <div class="aui-tab-item "><div class="tit-in" tapmode onclick="newsgroupeOn(2,this)">收到的回复<span class="dot"></span></div></div>
    </div>

    function newsgroupeOn(index, obj){

    //声明
      var btitInBtn = document.querySelector(".tit-in.aui-active");
      btitInBtn.classList.remove("aui-active");
      obj.classList.add("aui-active");

    })
    }

    //tab不需要验证active存在,他本来就有一个是存在的,tab是切换,不需要两个方法名

  • 相关阅读:
    Java编程思想读书笔记 第十章 内部类
    利用lambda和条件表达式构造匿名递归函数
    概率论与数理统计-课程小报告
    leetcode226 翻转二叉树
    leetcode199 二叉树的右视图
    leetcode114- 二叉树展开为链表
    leetcode145 二叉树的后序遍历 特别注意迭代
    leet144 二叉树的前序遍历
    leetcode113 路径总和2 特别关注
    leetcode 112 路径总和 特别关注
  • 原文地址:https://www.cnblogs.com/lsongyang/p/9699226.html
Copyright © 2011-2022 走看看