在函数中调用函数的Javascript

我正在使用jquery插件作为滑块。它包含一个我试图从外部调用的

pauseSlide

函数。以下是插件：

(function ($) {
    $.fn.liteSlider = function (options) {

        var defaults = {
            content: '.content',
            width: 500,
            height: 250,
            autoplay: false,
            delay: 3,
            buttonsClass: '',
            activeClass: '',
            controlBt: '',
            playText: ' Play',
            pauseText: 'Pause'
        };

        var options = $.extend(defaults, options);

        var slideNo = 1;
        var timer = 0;
        var playStatus = options.autoplay;
        var thisClass = ($(this).attr('class')).split(' ');
        var theClass = '.' + thisClass[0];
        var count = 0;
        var slides;
        var currentSlide = 1;
        var delay = parseInt(options.delay) * 1000;

        $(this).children(options.content).each(function () {
            slides = ++count;
        });

        function wrapContent(ele) {
            ele.wrap('<div class="sliderContentsWrap" />');
        }

        function applyCss(ele) {
            $('.sliderContentsWrap').css({
                padding: 0,
                margin: 0,
                width: options.width,
                height: options.height,
                overflow: 'hidden',
                position: 'relative'
            });

            ele.css({
                padding: 0,
                margin: 0,
                width: options.width * slides,
                height: options.height,
                position: 'absolute'
            });

            ele.children(options.content).css({
                float: 'left',
                width: options.width,
                height: options.height
            });
        }

        function resetButtons() {
            i = 0;
            $('.' + options.buttonsClass).each(function () {
                i++;
                $(this).addClass('bt' + i);
                $(this).attr('rel', i);
            });
        }

        function goToSlide(theSlide) {

            var animateLeft = -(options.width) * (parseInt(theSlide) - 1);
            $('.sliderContentsWrap' + ' ' + theClass)
                .animate({
                left: animateLeft
            });

            $('.' + options.buttonsClass).each(function () {
                $(this).removeClass(options.activeClass);
                if ($(this).hasClass('bt' + theSlide)) {
                    $(this).addClass(options.activeClass)
                }
            });

            currentSlide = theSlide;
        }

        function autoplay() {
            if (currentSlide < slides) {
                goToSlide(parseInt(currentSlide) + 1);
            } else {
                goToSlide(1);
            }
        }

        function playSlide() {
            clearInterval(timer);
            timer = setInterval(function () {
                autoplay();
            }, delay);

            $(options.controlBt).text(options.pauseText);
            playStatus = true;
        }

        function pauseSlide() {
            clearInterval(timer);
            $(options.controlBt).text(options.playText);
            playStatus = false;
        }

        function init(ele) {
            wrapContent(ele);
            applyCss(ele);
            resetButtons();

            if (options.autoplay == true) {
                playSlide()
            } else {
                pauseSlide();
            }
        }

        return this.each(function () {
            init($(this));

            $('.' + options.buttonsClass).click(function (e) {
                e.preventDefault();
                pauseSlide();
                goToSlide($(this).attr('rel'));
            });

            $(options.controlBt).click(function (e) {
                e.preventDefault();
                if (playStatus == true) {
                    pauseSlide()
                } else {
                    playSlide()
                };
            });

        });

    };

    //added this
    $.liteSlider = {
        pause: function() {
            alert('clicked');
            pauseSlide();
        }
    };   

})(jQuery);

（函数（$）{
$.fn.liteSlaider=函数（选项）{
var默认值={
内容：'.content'，
宽度：500，
身高：250，
自动播放：错误，
延误：3，
按钮类：“”，
activeClass:“”，
controlBt:“”，
playText:“播放”，
pauseText:“暂停”
};
var options=$.extend（默认值，选项）；
var slideNo=1；
var定时器=0；
var playStatus=options.autoplay；
var thisClass=（$（this.attr（'class'））.split（“”）；
var theClass='.'+thisClass[0]；
var计数=0；
var幻灯片；
var currentSlide=1；
var delay=parseInt（options.delay）*1000；
$（this）.children（options.content）.each（函数（）{
幻灯片=++计数；
});
函数包装内容（ele）{
元素包装（“”）；
}
函数applyCss（ele）{
$（'.sliderContentsWrap'）.css({
填充：0，
保证金：0，
宽度：options.width，
高度：options.height，
溢出：“隐藏”，
位置：'相对'
});
ele.css({
填充：0，
保证金：0，
宽度：options.width*幻灯片，
高度：options.height，
位置：'绝对'
});
ele.children（options.content）.css({
浮动：'左'，
宽度：options.width，
高度：options.height
});
}
函数重置按钮（）{
i=0；
$（'..+options.buttonsClass）.每个（函数（）{
i++；
$（this.addClass（'bt'+i）；
$（this.attr（'rel'，i）；
});
}
函数goToSlide（滑动）{
var animateLeft=-（options.width）*（parseInt（theSlide）-1）；
$（'.SliderContentsRap'+''+类）
.制作动画({
左：animateLeft
});
$（'..+options.buttonsClass）.每个（函数（）{
$（this.removeClass（options.activeClass）；
if（$（this）.hasClass（'bt'+theSlide））{
$（this.addClass（options.activeClass）
}
});
当前滑块=滑块；
}
函数autoplay（）{
如果（当前幻灯片<幻灯片）{
goToSlide（parseInt（currentSlide）+1）；
}否则{
戈托利德（1）；
}
}
函数playsiled（）{
清除间隔（计时器）；
定时器=设置间隔（函数（）{
自动播放（）；
}，延误）；
$（options.controlBt）.text（options.pauseText）；
playStatus=true；
}
函数pauseSlide（）{
清除间隔（计时器）；
$（options.controlBt）.text（options.playText）；
playStatus=false；
}
函数初始化（ele）{
包装内容（ele）；
applyCss（ele）；
重置按钮（）；
如果（options.autoplay==true）{
播放幻灯片（）
}否则{
pauseSlide（）；
}
}
返回此。每个（函数（）{
init（$（this））；
$（'..+options.buttonsClass）。单击（函数（e）{
e、 预防默认值（）；
pauseSlide（）；
goToSlide（$（this.attr（'rel'））；
});
$（options.controlBt）。单击（函数（e）{
e、 预防默认值（）；
如果（播放状态==真）{
pauseSlide（）
}否则{
播放幻灯片（）
};
});
});
};
//加上这个
$.LiteSloider={
暂停：函数（）{
警报（“点击”）；
pauseSlide（）；
}
};   
})（jQuery）；

---

除此之外，我使用的是

$.liteslaider.pause（）

显示警报，但不运行

pauseSlide（）

功能。有什么建议吗？

问题是对

pauseSlide

的调用与声明不在同一范围内。

pauseSlide

超出范围。解决这个问题的一个简单方法可能是声明

var pauseSlide范围中的某个位置，然后稍后分配它

(function ($) {
    var pauseSlide;

    $.fn.liteSlider = function (options) {

        var defaults = {
            content: '.content',
            width: 500,
            height: 250,
            autoplay: false,
            delay: 3,
            buttonsClass: '',
            activeClass: '',
            controlBt: '',
            playText: ' Play',
            pauseText: 'Pause'
        };

        var options = $.extend(defaults, options);

        var slideNo = 1;
        var timer = 0;
        var playStatus = options.autoplay;
        var thisClass = ($(this).attr('class')).split(' ');
        var theClass = '.' + thisClass[0];
        var count = 0;
        var slides;
        var currentSlide = 1;
        var delay = parseInt(options.delay) * 1000;

        $(this).children(options.content).each(function () {
            slides = ++count;
        });

        function wrapContent(ele) {
            ele.wrap('<div class="sliderContentsWrap" />');
        }

        function applyCss(ele) {
            $('.sliderContentsWrap').css({
                padding: 0,
                margin: 0,
                width: options.width,
                height: options.height,
                overflow: 'hidden',
                position: 'relative'
            });

            ele.css({
                padding: 0,
                margin: 0,
                width: options.width * slides,
                height: options.height,
                position: 'absolute'
            });

            ele.children(options.content).css({
                float: 'left',
                width: options.width,
                height: options.height
            });
        }

        function resetButtons() {
            i = 0;
            $('.' + options.buttonsClass).each(function () {
                i++;
                $(this).addClass('bt' + i);
                $(this).attr('rel', i);
            });
        }

        function goToSlide(theSlide) {

            var animateLeft = -(options.width) * (parseInt(theSlide) - 1);
            $('.sliderContentsWrap' + ' ' + theClass)
                .animate({
                left: animateLeft
            });

            $('.' + options.buttonsClass).each(function () {
                $(this).removeClass(options.activeClass);
                if ($(this).hasClass('bt' + theSlide)) {
                    $(this).addClass(options.activeClass)
                }
            });

            currentSlide = theSlide;
        }

        function autoplay() {
            if (currentSlide < slides) {
                goToSlide(parseInt(currentSlide) + 1);
            } else {
                goToSlide(1);
            }
        }

        function playSlide() {
            clearInterval(timer);
            timer = setInterval(function () {
                autoplay();
            }, delay);

            $(options.controlBt).text(options.pauseText);
            playStatus = true;
        }

        pauseSlide = function() {
            clearInterval(timer);
            $(options.controlBt).text(options.playText);
            playStatus = false;
        }

        function init(ele) {
            wrapContent(ele);
            applyCss(ele);
            resetButtons();

            if (options.autoplay == true) {
                playSlide()
            } else {
                pauseSlide();
            }
        }

        return this.each(function () {
            init($(this));

            $('.' + options.buttonsClass).click(function (e) {
                e.preventDefault();
                pauseSlide();
                goToSlide($(this).attr('rel'));
            });

            $(options.controlBt).click(function (e) {
                e.preventDefault();
                if (playStatus == true) {
                    pauseSlide()
                } else {
                    playSlide()
                };
            });

        });

    };

    //added this
    $.liteSlider = {
        pause: function() {
            alert('clicked');
            pauseSlide();
        }
    };

（函数（$）{
var pauseSlide；
$.fn.liteSlaider=函数（选项）{
var默认值={
内容：'.content'，
宽度：500，
身高：250，
自动播放：错误，
延误：3，
按钮类：“”，
activeClass:“”，
controlBt:“”，
playText:“播放”，
pauseText:“暂停”
};
var options=$.extend（默认值，选项）；
var slideNo=1；
var定时器=0；
var playStatus=options.autoplay；
var thisClass=（$（this.attr（'class'））.split（“”）；
var theClass='.'+thisClass[0]；
var计数=0；
var幻灯片；
var currentSlide=1；
var delay=parseInt（options.delay）*1000；
$（this）.children（options.content）.each（函数（）{
幻灯片=++计数；
});
函数包装内容（ele）{
元素包装（“”）；
}
函数applyCss（ele）{
$（'.sliderContentsWrap'）.css({
填充：0，
保证金：0，
宽度：options.width，
高度：options.height，
溢出：“隐藏”，
位置：'相对'
});
ele.css({
填充：0，
保证金：0，
宽度：
(function($) {
    var YourPluginMethods = {
        init: function (options) {
            return this.each(function () {

            });
        },
        pauseSlide : function(options) {
            return this.each(function () {
                // Do some stuff for each instance of your plugin here
            });
        }
    };

    $.fn.YourPlugin = function(method) {        
        // Method calling logic
        if (YourPluginMethods[method]) {
            return YourPluginMethods[method].apply(this, Array.prototype.slice.call(arguments, 1));
        } else if (!method || typeof method === 'object') {
            return YourPluginMethods.init.apply(this, arguments);
        } else {
            $.error('Method ' +  method + ' does not exist on jQuery.YourPlugin');
        }
    };
})(jQuery);

$('your-selector').YourPlugin('pauseSlide', {
    speed: 'slow'
});