Can I set global variables and use them in other document ready events?
I am using jQuery 1.6.2 and ColdFusion 9.
When a page is requested, many files are included. Several files contain the jQuery document ready method. I want to set some global variables that I can use throughout the entire page. For example, I want to use these variables for my slides:
SlideUpRate = 400;
SlideDownRate = SlideUpRate * 2;
It seems that this works inconsistently. Is there a way to make it work consistently?
+++++++++++++++++++++++++++++++++++++++++++++++ Answer
In the index.cfm file, I set my global variables that can be used and reused in other jQuery throughout the 开发者_运维技巧rendered page.
<script type="text/javascript">
var SlideUpRate = 250;
var SlideDownRate = SlideUpRate * 2;
var HideRate = 250;
var ShowRate = HideRate * 2;
var ImageUnsaved = "layout/checkbox_unsaved.png";
var ImageSaved = "layout/checkbox_saved.png";
$(document).ready(function() {
// other jQuery stuff
});
Yes you can by adding them to the global namespace:
var globalVar1;
$(document).ready(function(){
globalVar1 = "something";
});
$(document).ready(function(){
alert(globalVar1);
});
http://jsfiddle.net/QDPAm/
If you don't want to pollute the global scope with multiply variables you can make an object to contain these variables:
var vars = {};
And then in your ready
functions add variables to the vars
object.
$(document).ready(function(){
vars.my_variable_1 = "something";
});
And another ready
function:
$(document).ready(function(){
alert(vars.my_variable_1);
});
http://jsfiddle.net/aalouv/QDPAm/1/
I cant see why your example shouldn't work. Maybe because your are trying to access some variables before they are set?
var vars = {};
$(document).ready(function(){
alert(vars.my_variable_1); // undefined
});
$(document).ready(function(){
vars.my_variable_1 = "something";
});
http://jsfiddle.net/aalouv/QDPAm/3/
Also creating variables without the var indicator first will add the variable to the global scope, So you can access the variable with: window
or just without any namespace before.
$(document).ready(function(){
my_variable_1 = "something";
});
$(document).ready(function(){
alert(window.my_variable_1);
alert(my_variable_1);
});
http://jsfiddle.net/aalouv/QDPAm/2/
Evik,
I'd use a object literal to store you local variables like so:
var pageProperties = {
slideUpRate: 250,
hideRate: 250,
imageUnsaved: "layout/checkbox_unsaved.png",
imageSaved: "layout/checkbox_saved.png",
getSlideDownRate: function() {
return slideUpRate * 2;
},
showRate : function() {
return hideRate * 2;
}
};
Now when you want to access these page level properites you'd use the object literal:
pageProperties.slideUpRate;
pageProperties.getSlideDownRate();
One benefit you'll get by putting the calculated rates in a function is that you can encapsulate the functionality and make these functions more maintainable and portable.
Another thing I'd do is clean up the multiple $(document).ready functions by using more object literals as discussed in this blog post by Rebecca Murphey: http://blog.rebeccamurphey.com/2009/10/15/using-objects-to-organize-your-code.
精彩评论