I want to have a statement as
$(myVar).click(function(){
// Do some stuff
});
This statement is in the main .js file that is included on every page. I want to then have myVar defined in different files on different pages and then the statement above becomes active.
How do I do that?
Define it like this instead...
$(myVar).on('click', function(){
// Do whatever
});
And call that handler in your document using:
<script>var myVar=yourValue;</script>
<script src="myJs.js"></script>
If you do it this way, you will ensure your var is loaded before your script that relies on it and your DOM will carry out its merry way.
FYI - There is no real way to share a variable between multiple pages unless you define a default in your myJs.js file or create a global variable per HTML doc.
If I understand you correctly you can just the following:
Page 1
var myVar = $("#myElement");
<script src="main.js" type="text/javascript"></script>
Page 2
var myVar = $(".myElements");
<script src="main.js" type="text/javascript"></script>
You can define myVar before you include main.js
var myVar = "someThing";
--include main.js
Include the file that has the declaration of myVar before the script that uses it:
<script type="text/javascript" src="myVarSource.js"></script>
<script type="text/javascript" src="doStuffSource.js"></script>
Try initializing myVar before you load main.js
var myVar = "whatever";
<script src="main.js" type="text/javascript"></script>
var myVar=$("#id");
myVar.click(function(){
// Do some stuff
});
In main.js add this function rather..
var myVarClick = function (ele) {
// Do some stuff
alert(ele.val());
}
and in each page call this function..
$("button").click(function () {
myVarClick($(this));
});
