显示options未定义

老师，可以帮我看一下代码吗？之前一直是好的，在使用options添加dropdown-active和使用options添加click事件时，就显示options未定义。但是写插件时那里的options是可以打印出来的。

慕粉1257262530 2018-04-17

源自：实战：电商网站下拉菜单 3-2 用构造函数的形式重写dropdown模块

收起

2回答

小于飞飞 2018-04-18 11:12:27

你好，上传完整代码（涉及到的html、css\js 等)，以便更好检测问题，加油！

收起回答

提问者慕粉1257262530 2018-04-17 20:55:13

(function ($) {
    'use strict';

    function Dropdown(elem,options){
        this.$elem = $(elem);
        this.$layer =  this.$elem.find('.dropdown-layer');
        this.activeClass =  this.$elem.data('active')+'-active';
         // this.activeClass = options.active + '-active';


        this.$layer.showHide(options); //showHide初始化
        // this.$elem.hover(this.show,this.hide);

        // var self = this;
        // this.$elem.hover(function () {
        //     self.show();
        // },function () {
        //     self.hide();
        // });

        //改变this指向
        this.$elem.hover($.proxy(this.show,this),$.proxy(this.hide,this));

        console.log(options);
        // if(options.event === 'click'){
        //     console.log(options);
        //     this.$elem.on('click',$.proxy(this.show,this));
        //     $(document).on('click',$.proxy(this.hide,this))
        // }else{
        //     this.$elem.hover($.proxy(this.show,this),$.proxy(this.hide,this))
        // }

    }


    Dropdown.DEFAULTS = {
        event:'hover',   //click
        css3:false,
        js:false,
        animation:'fade',
        active:'dropdown'
    };
    Dropdown.prototype.show = function () {
        this.$elem.addClass(this.activeClass);
        this.$layer.showHide('show');
    };
    Dropdown.prototype.hide = function () {
        this.$elem.removeClass(this.activeClass);
        this.$layer.showHide('hide');
    };
    var dropdown = new Dropdown();
    dropdown.show();
    dropdown.hide();

//     function dropdown(elem,options) {
//         var $elem = $(elem),
//             $layer = $elem.find('.dropdown-layer'),
//             activeClass = $elem.data('active')+'-active';
//
//         $layer.showHide(options); //showHide初始化
//
//
//         $elem.hover(function(){
//             $elem.addClass(activeClass);
//             $layer.showHide('show');
//         },function () {
//             $elem.removeClass(activeClass);
//             $layer.showHide('hide');
//         });
//     };
//
// //    $('.dropdown').each(function () {
// //        dropdown($(this));
// //    });
    // var defaults = {
    //     css3:false,
    //     js:false,
    //     animation:'fade'
    // };
    $.fn.extend({ //插件形式调用
        dropdown:function (option) {
            return this.each(function () {
                var options = $.extend({},Dropdown.DEFAULTS,$(this).data,option);//最后一个对象覆盖前面的对象
                new Dropdown(this,options);
            });
        }
    });

})(jQuery);

收起回答