zoukankan      html  css  js  c++  java
  • 原生js实现选项卡样式切换的几种方式。

      先分享一个不能实现的实例(因为es5没有块作用域)

        for(var i=0; i<list.length; i++ )

          {

            list[i].onclick = function(){

                tabchange(i);

              }

          }

      解决方案:

        1.es6新的变量声明方式 let(es6具有块级作用域,解决es5存在的问题)

     

        for(let i=0; i<list.length; i++ )

          {

            list[i].onclick = function(){

                tabchange(i);

              }

          }

        2.利用闭包

        for(var i=0; i<list.length; i++ )

          {

            list[i].onclick = (function(){

                return function(){

                tabchange(i);

                }

              })(i);

          }

        3.为元素对象创建对应的索引

        for(var i=0; i<list.length; i++ )

          {

            list[i].myindex=i;

            list[i].onclick = function(){

                tabchange(this.myindex);//绑定元素对应的索引

              }

          }

      //这种方案一般也用于轮播图,当然是用框架就不用考虑这么多问题了  

  • 相关阅读:
    基于SAAJ的客户端
    SOAP消息的结构
    服务端的思考
    最简单的Web Service实现
    PLSQL的注释技巧
    复杂分支图示
    Tomcat常见错误
    maven常见错误
    SpringMvc参数传递中乱码问题
    springmvc常遇到的错误
  • 原文地址:https://www.cnblogs.com/angle-xiu/p/11312247.html
Copyright © 2011-2022 走看看