为了组织我的代码,我碰巧写为主javascript文件的命名空间。然后我想将该文件的一些功能调用到我的自定义javascript文件,比如说script.js
。问题是我无法访问命名空间的方法。这是我的示例代码:
main.js
$( function() {
"use strict"
var Accordian = {
slide : function() {
$('h3').click( function() {
$(this).next('div').slideToggle('1000');
$(this).toggleClass('toggled');
});
},
slideEaseOutBounce: function() {
$('h3').click( function() {
$(this).next().animate(
{'height' : 'toggle'}, 1000, 'easeOutBounce'
);
$(this).toggleClass('toggled');
});
},
slideEaseInOutExpo: function() {
$('h3').click( function() {
$(this).next().animate(
{'height' : 'toggle'}, 1000, 'easeInOutExpo'
);
$(this).toggleClass('toggled');
});
}
});
我已尝试过如下 script.js
$(document).ready( function() {
Accordian.slide();
});
更新:
这是链接: http://jsnamespace.comyr.com/using-accordian.html
出现错误消息"ReferenceError: Accordian is not defined"
非常感谢任何帮助。
答案 0 :(得分:3)
注意:line 63
中script.js
缺少分号。
由于修改您的网站以使用此代码有效:
<script type="text/javascript">
$(document).ready( function() {
Accordian[0].slide();
});
</script>
似乎将“Accoridian”包装在jQuery函数中需要将其作为子元素取消引用。
当您移除$
line 1
转弯时的script.js
var Accordian = $(function () {
进入
var Accordian = (function () {
(就像@anonyme建议的那样)it works原来打电话给Accordian.slide()
。
答案 1 :(得分:2)
首先,您必须创建一个独特的根命名空间:
window.Accordian = window.Accordian || {};
这一部分必须在所有下一部分之上完成! 它可以在脚本标记的html页面的头部完成。
您可以使用对象后:
//creating a function :
Accordian.slide = function() {
$('h3').click( function() {
$(this).next('div').slideToggle('1000');
$(this).toggleClass('toggled');
});
}
//and later using it :
Accordian.slide()
这是最简单的方法!
你喜欢使用多个文件,所以让我们试试:
<强> mains.js 强>
/*$*/( function(globalAccordian) {
"use strict"
/* var Accordian = { */
globalAccordian = {
// doing like this will override your globalAccordian
// if it was already generated by another script
slide : function() {
$('h3').click( function() {
$(this).next('div').slideToggle('1000');
$(this).toggleClass('toggled');
});
},
slideEaseOutBounce: function() {
$('h3').click( function() {
$(this).next().animate(
{'height' : 'toggle'}, 1000, 'easeOutBounce'
);
$(this).toggleClass('toggled');
});
},
slideEaseInOutExpo: function() {
$('h3').click( function() {
$(this).next().animate(
{'height' : 'toggle'}, 1000, 'easeInOutExpo'
);
$(this).toggleClass('toggled');
});
}
})( window.Accordian || {} );
<强>的script.js 强>
$(document).ready( function() {
Accordian.slide();
})
答案 2 :(得分:1)
您无法访问命名空间,因为它封装在一个函数中。 我建议阅读revealing module pattern。
的jsfiddle: http://jsfiddle.net/R927K/
示例:
var Accordian = (function() {
var Accordian = {
slide : function() {
alert('sliding');
}
};
return Accordian;
}());
Accordian.slide();