Referencing JQuery function in external .js file - syntax?

Question

I get the feeling I'm missing something obvious, but I'm new to all of this, so please forgive a cry for help!

How exactly should I call a jQuery function of my own stored in a separate .js file? I've developed a working prototype of my app but am now trying to tidy up the code, and move various jQuery functions into a separate file where I can access them on each page. But for some reason I'm finding it impossible to access the code once I've turned it into a named function, either in the head of my html document or in the separate .js file. Crucially, I can't find a simple reference to the correct syntax for actually calling the function!

Anyway, here's the relevant bits of code:

<head>

<link rel="stylesheet" href="jquery.mobilecus-1.1.0.min.css"/>
<script type="text/javascript" charset="utf-8" src="cordova-1.8.1.js"></script>
<script src="js/jquery-1.7.2.js"></script>
<script src="js/jquery.mobile-1.1.0.min.js"></script>
<script src="js/myjquery.js"></script>

</head>
<body onload="onBodyLoad()">

<div data-role="page" id="page1" class="page">

    <script type="text/javascript">
        $(document).ready(function () {
        alert("alert1!");
        $(InitRightBar());   /// This is the problem!
        });
        </script>
...
</div>
...
</body>

And the entirety of the separate "myjquery.js" file:

$(function() { //ready

function InitRightBar (){
alert("alert2!");
$("#rightbar").live("swipeleft", function(){
                  $.mobile.changePage($("#page2"))
            });
}

}); //end ready

NB: Alert 1 is always firing, but Alert 2 never fires, even if I put it the function in the html head. I've tried multiple different syntaxes instead of "$(InitRightBar());

Furqan Hameedi · Accepted Answer · 2012-06-17 14:48:26Z

2

From you JS File , keep only these lines

   function InitRightBar (){
      alert("alert2!");
       $("#rightbar").live("swipeleft", function(){
              $.mobile.changePage($("#page2"))
        });
    }

and remove the First and the last line.Also change the following

   $(InitRightBar());   /// This is the problem!

to

   InitRightBar();

only.

answered Jun 17, 2012 at 14:48

Furqan Hameedi

4,3903 gold badges29 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user1459465 Over a year ago

Thanks so much for a swift answer - that seems to have fixed it! :-)

Collectives™ on Stack Overflow

Referencing JQuery function in external .js file - syntax?

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related