views:

1065

answers:

4

Hello All,

I'm new to Jquery and am running into an issue when trying to put my JQuery scripts into a separate file in my project folder. I'm working with a plug-in called Corner. Here is the relevant part of the HTML file

<script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="scripts/jquery.corner.js"></script>
<script type="text/javascript" src="scripts/myJQuery.js"></script>

Commenting out the above line, and uncommenting the script below makes the plug in work. The contents of myJQuery.js are the exact script below (excluding script tags).

 <!--<script>
  $(document).ready(function() 
  {
    $("div.container").corner();
      $("div.linkList").corner();
   })
 </script>-->

<body>
<div class ="container">
<div class ="header"></div>
<div class ="linkList"></div>
</div>
</body>

Any ideas on why the same code is working one way (in HTML file), but not the other way (separate .js file)? Thanks in advance.

A: 

The usual cause is a slip up in file naming or permissions.

Check your web server logs for errors.

David Dorward
+1  A: 

Are you saying that the code:

$(document).ready(function() 
            {
                            $("div.container").corner();
                $("div.linkList").corner();
      })

Works when it is inline, but not in an external file?

Is the above code the only code in myJQuery.js? If it isn't, make sure there are syntax errors in the file keeping the code from firing. I created an example of what you have above with the code in a separate file and it works correctly. Check out http://thetimbanks.com/demos/help/separate/ and view the source if you want to see the code.

T B
+1  A: 

If working from a PC, check that you saved your file in ANSI encoding format. If it is in UTF-8 format make sure you have specified that in your script tag, i.e.:

<script type="text/javascript" src="scripts/myJQuery.js" charset="UTF-8"></script>
NGJ Graphics
A: 

The problem i see is the HTML comments you use <!-- -->..

if the are put inside a js file they would cause the file to not load since they are not Javascript comments but HTML ..

so if the code in the js file is

<!--
                $(document).ready(function() 
                {
                                $("div.container").corner();
                    $("div.linkList").corner();
          })
-->

then do it like this

//<!--
                $(document).ready(function() 
                {
                                $("div.container").corner();
                    $("div.linkList").corner();
          })
//-->
Gaby