我一直在尝试利用揭示模块模式,并认为我将为非css3自定义滚动条创建一个函数。
var sb=(function($){
//Private
var settings=function(props){
return{
wrapper: props.wrapper ? document.getElementById(props.wrapper):null,
thumb: props.thumb ? document.getElementById(props.thumb):null,
track: props.track ? document.getElementById(props.track):null,
left: props.left ? props.left:null,
right: props.right ? props.right:null,
contentWidth: props.contentWidth? props.contentWidth:null
};
};
var LOG=function(input){
console.log(input)
};
//Object Literal
return{
Log:LOG,
settings:settings
};
})(jQuery);
以上是模块。我设置的值如下:
window.onload=function(){
sb.settings({wrapper:'bodyWrapper',thumb:'thumb',track:'track'});
}
但是,当我尝试测试它时,我会继续“未定义”和其他错误。在模块内运行console.log(settings.wrapper)
会返回undefined
。我真的不知道我哪里出错了,所以任何帮助都会非常感激。提前致谢
答案 0 :(得分:0)
在模块内运行
console.log(settings.wrapper)
会返回undefined
。
当然,因为settings
是函数对象(没有wrapper
属性),并且在调用时没有返回对象。你似乎想要
var sb = (function(){
// private variables
var settings = {};
// public (exported) properties
return {
log: function(input) {
console.log(input);
},
getSetting: function(name) {
return settings[name];
},
setSettings: function(props){
settings = { // assign to the private variable!
wrapper: props.wrapper ? document.getElementById(props.wrapper) : null,
thumb: props.thumb ? document.getElementById(props.thumb) : null,
track: props.track ? document.getElementById(props.track) : null,
left: props.left || null,
right: props.right || null,
contentWidth: props.contentWidth || null
};
return true;
}
};
})();
window.onload = function(){
sb.setSettings({wrapper:'bodyWrapper',thumb:'thumb',track:'track'});
sb.log(sb.getSetting("wrapper"));
}