jQuery code wont work outside Netbeans

Question

Hi I am in a bit confused about a script not working.Here is my situation I have this code:

<script src="jquery.js"></script>
<script>
    $(document).ready(function(){

        $('a#Press_one').click(function(event){
            event.preventDefault();
            $('div#main_left').load('1.html');

        })

    });
</script>
</head>
<body>
         <div id="main_left"></div>
         <a href="#" id="Press_one">Citeste mai mult...</a>
</body>
</html>

I have writen this using NetBeans IDE and when I run it , it works very well.I've saved the file with the name index.html , and went to the folder where the file is place.I double clicked on the link but the weird thing is it doesn't work.I tried again in NetBeans and it works.What is wrong here?

Define "doesn't work." Is the call to `1.html` firing? Does `1.html` exist where the code thinks it should? Running an AJAX call from a locally-opened file (as opposed to a web-served resource, which I think Netbeans internally does) might not work. — David, May 10 '12 at 18:34
if i run this from netbeans it starts in firefox and it runs.It loads the file 1.html and everything works.If I go to the folder and open index.html and do exactly the same think when I click it dosent work — user1146440, May 10 '12 at 18:35
Right, you said that in the question. But what happens when you debug the JavaScript code while running it outside of Netbeans? Does it make an AJAX call to a resource? What is the resource? Does that resource exist? What is the response? I definitely think it's getting hung up on the fact that you're working on a file system, not on a web server. — David, May 10 '12 at 18:39
Is the click event firing? Have you tried putting a breakpoint in the JS using FireFox to see if it hits? — JohnFx, May 10 '12 at 18:39
no the click event is not firing.I have tested that by ading an alert outside the click event and one inside the one outside fires after the browser starts but the one inside isent firing event after I click the link — user1146440, May 10 '12 at 18:40
Surely this is as simple as netbeans is running it on a server which is why it is working, and not working when you just open the file. — noShowP, May 10 '12 at 18:48
what errors does it give when you clikc not running netbeans? are you 100% sure that all 3 files are inside the same folder? jquery.js the index.html and the 1.html — Huangism, May 10 '12 at 18:51
yes I am very sure(If they were not in the same folder it wouldent have worked from netbeans either) and I am not getting any errors — user1146440, May 10 '12 at 18:57

score 0 · Answer 1 · answered May 10 '12 at 18:33

0

Just a hunch, but I am betting you didn't copy the jquery.js file out to the new location of the html file.

answered May 10 '12 at 18:33

JohnFx

34,542
18
104
162

I am runing the file form the same place where I have my netbeans project the jQuery file is there – user1146440 May 10 '12 at 18:34

score 0 · Answer 2 · answered May 10 '12 at 19:05

0

Well, it's quite obvious why the code in this question does not work, after reading load()

But you are missing the div #main_left in the html I tried this locally with the div, and it works fine

answered May 10 '12 at 19:05

Huangism

16,278
7
48
74

wel actualy I forgot to put it in the stackoverflow question but I have it in the project – user1146440 May 10 '12 at 19:19
1

hmm I tested this code on local and it works perfect. Does the 1.html have content without the server running? can you post sample content of 1 – Huangism May 10 '12 at 19:23

score 0 · Answer 3 · answered May 21 '13 at 16:16

Try this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>
    $(document).ready(function(){

        $('a#Press_one').click(function(event){
            event.preventDefault();
            $('div#main_left').load('1.html');
        })
    });
</script>
</head>
    <body>
         <div id="main_left"></div>
         <a href="#" id="Press_one">Citeste mai mult...</a>
    </body>
</html>

It's recommended to use a content delivery network or CDN to get all the files you might need, there are many javascript libraries and other types of libraries which are not on Google nor Microsoft's CDN but jQuery is in almost on every single CDN.

Please check the code above to ensure you are indeed getting the js file and check the browser's tools for any javascript errors if for any reason jQuery isn't loaded then window.$ == undefined and window.jQuery == undefined will be true. Remember $ is a shorthand for jQuery.

score 0 · Answer 4 · edited May 23 '17 at 10:25

Are you using Chrome or Firefox? If Chrome, this isn't a problem with it not finding jQuery. If I run this, I get the following error in the javascript console:

Origin null is not allowed by Access-Control-Allow-Origin.

This is basically a security feature in the browser blocking the XMLHttpRequest that load makes. This is pretty common when trying to do ajax-ish stuff from a local file. If you serve it up on a file server, it should be fine, but Chrome won't run this from a local file to prevent any security issues from scripts.

If I run this in Firefox, it works. Chrome has tighter security restrictions for loading scripts from local file systems.

There is a good discussion on it in this stack overflow question as well: Origin null is not allowed by Access-Control-Allow-Origin

Eric Hodonsky · Answer 5 · 2012-05-10T18:40:21.487

-3

You need to have the script tag parsed by the browser... try adding type="text/javascript" to the script tag like below:

<script type="text/javascript">/*theFunction()*/</script>

And where is the div#main_left at? http://jsfiddle.net/sVaHa/

edited May 10 '12 at 18:40

answered May 10 '12 at 18:35

Eric Hodonsky

5,617
4
26
36

jQuery code wont work outside Netbeans

5 Answers5