这绝对让我发疯。
当我尝试在[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;