javascript - Apakah yang dilakukan oleh setIndex?
伊谢尔伦
伊谢尔伦 2017-07-05 10:53:15
0
1
684
<ul class="tab-top" id="tab_top">
        <li class="current">公告</li>
        <li>规则</li>
        <li>论坛</li>
        <li>公益</li>
        <li>安全</li>
    </ul>
   <p class="tab-bottom" id="tab_bottom">
        <p class="tab-content selected">
            <ul>
                <li>
                    <a href="#">数据七夕:金牛爱送玫瑰</a>
                </li>
                <li>
                    <a href="#">阿里打造"互联网监管"</a>
                </li>
                <li>
                    <a href="#">10万家店60万新品</a>
                </li>
                <li>
                    <a href="#">全球最大网上时装周</a>
                </li>
            </ul>
        </p>
    </p>
//  获得属性
     function TabFn() {
         this.tabLi = $('tab_top').getElementsByTagName('li');
         this.tabC = $('tab_bottom').getElementsByClassName('tab-content');
     }

    //  定义原型方法
    TabFn.prototype = {
        // 1.初始化事件
        initEvent: function () {
            this.setIndex();
            this.bindEvent();
        },

        // 2.设置索引
        setIndex: function () {
            for (var i = 0; i < this.tabLi.length; i++) {
                var li = this.tabLi[i];
                li.index = i;
            }
        },

        // 3.绑定事件
        bindEvent: function () {
            for (var i = 0; i < this.tabLi.length; i++) {
                var own = this;
                this.tabLi[i].onmouseover = function () {
                    own.handler(this);
                }
            }
        },


        // 4.事件处理函数
        handler: function (that) {
            for (var j = 0; j < this.tabLi.length; j++) {
                this.tabLi[j].className = '';// !驼峰结构
                this.tabC[j].style.display = 'none';
            }
            // that = li.current;
            that.className = 'current';// that 为当前的tab上的li
            this.tabC[that.index].style.display = 'block';
        }
    }
     window.onload = function () {
   
        var tab = new TabFn();
        tab.initEvent();
    }


> 请问下这里setIndex的作用
伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

membalas semua(1)
我想大声告诉你

Fungsi setIndex adalah untuk menetapkan indeks untuk elemen dalam senarai teratas Tujuan menetapkan indeks adalah kerana indeks i tidak boleh diluluskan semasa bindEvent, kerana selepas gelung dilaksanakan, i sentiasa sama dengan ini.tabLi. .panjang, dan semasa menetapkan kandungan tab, sama ada Apabila bersembunyi

this.tabC[that.index].style.display = 'block';

Anda perlu tahu yang mana anda sedang beroperasi, yang merupakan tujuan setIndex.

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!