无法访问的全局变量

时间:2017-04-06 10:25:48

标签: javascript jquery

这绝对让我发疯。

当我尝试在[prevObject: r.fn.init(1)]函数中检索变量$venusThumbDiv时,jQuery会通知我此消息collector()。换句话说,我猜jQuery在页面内找不到任何$('.venus-thumb-div')(虽然这个类有四个div)。

令人难以置信的是,在下面的代码段中,代码完全按照预期的方式工作,但如果我在编辑器中编写并运行代码,则相同的代码片段无法正常工作它在同一个浏览器上!让它工作的唯一方法"离线"在collector()函数中取消了var声明,但显然它完全没用,因为我需要var $venusThumbDiv是全局的。

有没有人知道为什么我会遇到这个问题?



var venusGallery = function () {

    var $venusThumbDiv              = $('.venus-thumb-div');

    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@       PUBLIC FNS       @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    /* ~~~~~~~~~~~~~~~~~~~     collector()    ~~~~~~~~~~~~~~~~~~~ */
    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    var collector = function () {
        // var $venusThumbDiv              = $('.venus-thumb-div');
        console.log("Div number: " + $venusThumbDiv.length);
        console.log($venusThumbDiv); 
    };

    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    /* ~~~~~~~~~~~~~~~~~~~     setOpts()    ~~~~~~~~~~~~~~~~~~~ */
    /* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
    var setOpts = function (choosen_options) {
        var options = {
            progression:    '<div id="venus-progression" style="color: white"></div>',
            share:          '<div id="venus-share"></div>',
            fullscreen:     '<div id="venus-fullscreen"></div>',
            download:       '<div id="venus-download"></div>',
            description:    '<p id="venus-description"></p>'
        };

        /* Default: no options; options are showed only if declared and set to true in venusGallery.setOpts({}); */
        $.each(options, function (key, value) {
            if (choosen_options[key]) {
                options[key] = value;
            } else {                                    // if false or not declared: not showed
                options[key] = '';
            }
        });

        venusOpts = options;
    };
    /* *****************************************************************************************************************
     * ************************************************************************************************************** */
    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@       PUBLIC FNS DEFINITION       @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    /* @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ */
    return {
        setOpts: setOpts,
        collector: collector
    };
    /* *****************************************************************************************************************
     * ************************************************************************************************************** */

}();
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="venus-gallery">

    <div class="venus-thumb-div" data-image="../img/bv.jpg">
        <img src="../img/thumb/bv_thumb.jpg" class="venus-thumb">
    </div>
    <div class="venus-thumb-div" data-image="../img/islamuj.jpg">
        <img src="../img/thumb/islamuj_thumb.jpg" class="venus-thumb">
    </div>
    <div class="venus-thumb-div" data-image="../img/vertical.jpg">
        <img src="../img/thumb/vertical_thumb.jpg" class="venus-thumb">
    </div>
    <div class="venus-thumb-div" data-image="../img/pano.jpg">
        <img src="../img/thumb/pano_thumb.jpg" class="venus-thumb">
    </div>
    
</div>


<script>
    $(document).ready(function () {
        venusGallery.setOpts({
            progression: true,
            download: true,
            share: true,
            fullscreen: true
        });
        venusGallery.collector();
    });
</script>
&#13;
&#13;
&#13;

0 个答案:

没有答案