0

作为一个 javascript 菜鸟，我很难理解如何在提供的示例中将变量从一个函数获取到另一个函数。

我想使用 in 中设置的xx.projects.resizewinHeightxx.projects.item.next您会在其中看到 console.log(winHeight)）。

我应该在这里看什么？

var xx = {

    init: function()
    {   
        xx.listener.init()
    },


    listener: {

        init: function()
        {
            xx.listener.resize()
        },

        resize: function()
        {
            xx.projects.resize()
            $(window).on('resize',function(){
                xx.projects.resize()
            })
        },
    },

    projects: {

        resize: function()
        {
            var $display = $('section .item.curr');
            var $displayNotActive = $('section.curr .item.next, section.curr .item.prev');

            var winWidth = $(window).width();
            var winHeight = $(window).height();

            var containerWidth, containerHeight;

            if(winWidth > 1450) {
                if(winHeight > 1050) {
                    containerWidth = 1200;
                    containerHeight = 900;
                } else {
                    containerWidth = winWidth - 250;
                    var helperHeight = Math.floor(containerWidth * 3/4);
                    if(helperHeight > (winHeight - 150)) {
                        containerHeight = winHeight - 150;
                        containerWidth = Math.floor(containerHeight * 4/3); 
                    } else {
                        containerHeight = helperHeight; 
                    }
                }
            } else if(winWidth < 600) {
                containerWidth = 300;
                containerHeight = 225;
            } else {
                containerWidth = winWidth - 250;
                var helperHeight = Math.floor(containerWidth * 3/4);
                if(helperHeight > (winHeight - 150)) {
                    containerHeight = winHeight - 150;
                    containerWidth = Math.floor(containerHeight * 4/3); 
                } else {
                    containerHeight = helperHeight; 
                }
            }
        },


        item: {
            next: function()
            {
                var s = $('#projects section.curr')
                    a = s.find('.item.curr'),
                    n = a.next('.item'),
                    l = a.position()

                console.log(winHeight);

                if( n.length > 0 ){
                    a.animate({ left: '-100%' }, ep.projects.config.item.speed, ep.projects.config.item.easing)
                    n.animate({ left: l.left }, ep.projects.config.item.speed, ep.projects.config.item.easing, function(){
                        a.removeClass('curr').addClass('prev')
                        n.removeClass('next').addClass('curr')                      
                    })
                }               
            },
        },
    }
}

$(document).on('ready', xx.init) // Document loaded, DOM ready
4

1 回答 1

0

在对象范围内声明winHeightand并使用and访问它。winWidththis.winWidththis.winHeight

var xx = {

    projects: {
        resize: function () {
            //we are saving winWidth, winHeight in the projects object scope so that it can be accessed from other functions in the same scope
            this.winWidth = $(window).width(); 
            this.winHeight = $(window).height();

            var containerWidth, containerHeight;

            if (this.winWidth > 1450) {
                if (this.winHeight > 1050) {
                    containerWidth = 1200;
                    containerHeight = 900;
                } else {
                    containerWidth = this.winWidth - 250;
                    var helperHeight = Math.floor(containerWidth * 3 / 4);
                    if (helperHeight > (this.winHeight - 150)) {
                        containerHeight = this.winHeight - 150;
                        containerWidth = Math.floor(containerHeight * 4 / 3);
                    } else {
                        containerHeight = helperHeight;
                    }
                }
            } else if (winWidth < 600) {
                containerWidth = 300;
                containerHeight = 225;
            } else {
                containerWidth = this.winWidth - 250;
                var helperHeight = Math.floor(containerWidth * 3 / 4);
                if (helperHeight > (this.winHeight - 150)) {
                    containerHeight = this.winHeight - 150;
                    containerWidth = Math.floor(containerHeight * 4 / 3);
                } else {
                    containerHeight = helperHeight;
                }
            }
        },


        item: {
            next: function () {
                var s = $('#projects section.curr')
                a = s.find('.item.curr'),
                    n = a.next('.item'),
                    l = a.position()

                    console.log(this.winHeight);

                if (n.length > 0) {
                    a.animate({
                        left: '-100%'
                    }, ep.projects.config.item.speed, ep.projects.config.item.easing)
                    n.animate({
                        left: l.left
                    }, ep.projects.config.item.speed, ep.projects.config.item.easing, function () {
                        a.removeClass('curr').addClass('prev')
                        n.removeClass('next').addClass('curr')
                    })
                }
            },
        },
    }
}

http://jsfiddle.net/FDeKe/

于 2013-03-03T14:03:35.800 回答