I am getting this error when i run my webpage in IE(the code runs fine in other browsers).
This is the HTML code:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
</head>
<body>
<--- some html code --->
<iframe src='http://localhost/page1.php' style="background: transparent; overflow: hidden; height: 210px; width: 390px;" frameborder="0" />
</body>
</html>
This is page1.php
<!DOCTYPE html>
<html>
<body>
<form action="usercheck.php" method="POST">
USERNAME:<input name="uname" id="uname" type="text" maxlength="12" required/>
<input type="submit" value="Submit">
</form>
</body>
</html>
This is usercheck.php
<?php
//some php code
?>
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
</head>
<body>
<--- some html code --->
</body>
</html>
The problem is that when reach usercheck.php after clicking on submit button in page1.php i get the error http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js. Access is denied. Here is an image of the error: http://i.stack.imgur.com/diCoF.jpg . Then consequently i get the error that '$' symbol is not defined(which is due to the failure to load the jquery library).
EDIT-
I have tried including the jquery file in my server but still the error is comming. I have also tried this code for usercheck.php:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
/*! jQuery v1.10.1 | (c) 2005, 2013 jQuery Foundation, Inc. | jquery.org/license
//# sourceMappingURL=jquery.min.map
//and the rest of the jquery library...
</script>
</head>
<body>
<--- some html code --->
</body>
</html>
The error i am getting this time is this:http://i.stack.imgur.com/hR9aN.jpg (The original name of usercheck2.php is rscheck.php in my server). Then consequently i get the error that '$' symbol is not defined(which is due to the failure to load the jquery library). If i directly open the contents of page1.php (by the url- localhost/page1.php) then everything works fine.
This is the only code for which i am using JQuery:
if($("#pret").contents().text().search("NAMECHECK: NOTAVALIBLE")!=-1)
I could exclude jquery only if i can convert this code to javascript.
This is a legit jQuery 1.10.1 bug: http://bugs.jquery.com/ticket/13980 .
Using jQuery 1.10.0, or 1.10.2 the error no longer occurs.
Try to download jquery.min.js to your server and include it from there. For example:
<script type="text/javascript" src="/jquery.min.js"></script>.
It looks like internet explorer can't access the resource: downloading it to your own server might solve the issue.
Here is the working solution to my question. The reason i wanted jquery was that i wanted to run this code:
if($("#pret").contents().text().search("NAMECHECK: NOTAVALIBLE")!=-1)
I removed jquery library and used this javascript to do the same:
var n=document.getElementById("pret").innerHTML.search("NAMECHECK: NOTAVALIBLE");
if(n != -1)
Now there is no error in the page and i am able to do what i wanted. So the error was caused as jquery library was not able to load in the webpage. But i dont know why even after downloading the jquery library in my server i was getting the same error ie. 'Access is denied'.
The reason is in the iframe. As jQuery is loaded into the iframe from the external host, each time when you are trying to use any jQuery function in your main/outer html file, IE throws the error due to security reasons.
1) Either upload jQuery to your server,
2) or include it in main html file only (not in iframe).
Related
Why I can't reload the same page after I create two cookies by setcookie() function?
The page kept on loading to timeout after reload,no any error message in apache log and nothing in chrome developer tool.
The problem maybe crashed with javascript,because I removed the line in HTML,the page can load,any method to correct this bug?
this is code:
<!doctype html>
<html>
<head>
<?php include "**cookie2.php**";?>
<!--other content in head-->
</head>
<body>
**<!--a button onclick will run cookie1.php-->**
<!--other contents in body-->
<script src="**readcookie1.js**" language="javascript"></script>
</body>
</html>
in file **cookie1.php**
{
**setcookie("login",1,0,"/");**
}
in file **cookie2.php**
{
**setcookie("pageView",0,0,"/");**
}
in file **readcookie1.js**
{
//use **document.cookie** to get cookie2
}
oh,I found the problem.
My function to read cookies in javascript had bug,so process stuck there.I have revised it.
It should be easy,
but as easy as it should be I can't solve the problem.
If I'm typing the following HTML and JS code into an online editor,
everything works fine but if I'm typing this into my (offline) editor it won't work.
Here's the online code:
http://jsbin.com/kenurunahu/1/edit?html,js,output)
I bet it has something to do with the loading order and how the files are linked.
Thats how my (lokal) HTML-file looks like (where the files are linked):
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" content="Index.css">
<script src="Script.js"></script>
</head>
<body>
<p id="demo">
something
</p>
</body>
</html>
Many Thanks for Help!
[Update]
Firefox and Chrome display the JS file. Sometimes I get an error message that says 'innerHTML is null', but if I write the same code into the console everything works fine.
you have the error when the js script is loaded before the html dom is fully loaded by the browser. A simple solution for your testing is to place the script include at the end of your html page, like this :
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" content="Index.css">
</head>
<body>
<p id="demo">
something
</p>
<script src="Script.js"></script>
</body>
</html>
A better solution is to run your script only when the dom is fully loaded. For example with the body onload event :
<body onload="yourFunc()">
Or event better by using only js code, for example with jquery ready function or by writing a simple custom handler that should work on all major browsers :
document.addEventListener("DOMContentLoaded", function(event) {
//call your func here
});
Hope that helps.
A few guesses:
Capitalization is important. If the file is named script.js do not link to Script.js
Is your js file in the same folder as the index.html document? Because that is what you are saying.
Normally, we arrange our file structure something like this:
public_html
- css
- js
- img
- inc
If your styles/scripts are stored in sub-folders, such as js and css, then you must amend your references to:
<link rel="stylesheet" content="css/Index.css">
<script src="js/Script.js"></script>
As a good practice, your scripts should be placed at the closing of body tag. External scripts are blocking and hence it would make sense we do not put them at the top. Also, when your script placed at the top runs, your DOM may not be ready, which means any element your script is trying to access may not be present in DOM at all which results in your error.
Hence, all your scripts should be at the closing of body tag. That way when the script loads and runs, you can be assured that the DOM is ready.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" content="Index.css">
</head>
<body>
<p id="demo">
something
</p>
<script src="Script.js"></script>
</body>
</html>
this is a very odd problem indeed and I hope it's simple. I cannot get a simple select and append to work in my html document, but it works when I'm in the chrome browser console.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
<script src="/js/script.js"></script>
<script>
$('[data-js="works"]').append("hello");
</script>
</head>
<body>
<div data-js="works"></div>
test
</body>
</html>
When I put that line of script in the console, hello appears above test. When I just open the page, test is there alone. I was running a script from this page earlier and when I tried to select an element it didn't work. I then went to inline script to see if it would even work there, no. I've seen if it works from inline script without the imported script, also no. Console has no bug information. I can print from that inline script to my console if I want, but this code still isn't running properly.
Doesn't work with my local httpserver and doesn't work just as a locally opened file.
This is because the script is executed before the page is loaded so the target div does not exist yet.
The solution is to wait for the page to be fully loaded before doing something.
The $ function can be used for this. Give it a callback and it will be executed once the page is loaded.
You can also use window.addEventListener("load", callback); that doesn't need jQuery.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
<script>
$(function(){
$('[data-js=works]').append("hello");
});
</script>
</head>
<body>
<div data-js="works"></div>
test
</body>
</html>
Another solution can be to insert your script at the end of the page. It is not as neat though in my opinion.
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ=" crossorigin="anonymous"></script>
</head>
<body>
<div data-js="works"></div>
test
<script>
$('[data-js=works]').append("hello");
</script>
</body>
</html>
Try the following, hope it will solve your problem
(function($) { // This will solve namespace problem (if any)
// Write your JQuery code here
})(jQuery);
Either you put the .js file at the end of the body or put your JS code between $(document).ready(function(){ //code inside })
Is it possible to load javascript without jQuery? I spent the better portion of yesterday evening simply trying to create the most basic HTML page with working CSS and Javascript and - despite the numerous methods I have tried - none of them have worked. Here is my basic HTML page:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" href="style.css">
<script src="script.js" type="text/javascript"></script>
</head>
<body>
<div>On</div>
<input type="button" onclick="popup()" value="Click Me!">
</body>
</html>
This is being hosted locally on XAMPP, the page displays fine and the CSS works fine, the javascript is in the same directory as the html page and works fine when written inline with the HTML. However the js does not work in any of the following scenarios when trying to include it as an externality:
When application/javascript is used above it still doesn't work. All I receive in either case (in the Firebug script window) is "popup()" and that's it. Here is the script.js file:
function popup() {
alert("Hello World")
}
This js also doesn't work (I tried it even though I'm not parsing XML):
//<![CDATA[
function popup() {
alert("Hello World")
}
//]]>
nor this:
document.addEventListener('DOMContentReady', function popup() {
alert("Hello World")
})
nor this:
<script type="text/javascript">
function popup() {
alert("Hello World")
}
</script>
Not that I really expected it too, but I was getting desperate. If anyone knows what's going on, I'd appreciate any info.
I'm open to this being an issue with hosting this locally on XAMMP but find it doubtful as CSS and HTML are both flying. However the js works if I include it inline with the HTML(?). If it helps, when Firebug displays popup() in the script window it also shows an #conn1source connection.
UPDATE: according to one of the suggestions in the comments if I only write the following in the js file it works:
alert("Hello World")
however the function does not. So I'm guessing this means that I wrapped the function somehow incorrectly in the js file, but I'm following standard practice as far as I am aware.
I have a script tag like
<div id='CommentBox'></div>
<script src="http://www.mywebsite.com/widget.js" type="text/javascript" />
This javascript creates a comment box. (like facebook comment box)
But when users copy/paste same exact script tag more than once Chrome and IE9 does not request 2nd, 3rd file again, because it is cached. But actually people want to use comment box more than once in the same page. How can I break browser cache and force it to download as many as people pasted in their blog?
You're doing it wrong.
If you want two or more comment boxes just call the code twice. A script include is not like a function call.
Instead of Code that you write use this code:
Main HTML File:
<html>
<head>
<script src="http://www.mywebsite.com/widget.js" type="text/javascript" />
</head>
<body>
<div id="CommentBox"></div>
<script type="text/javascript">
Func1();
</script>
</body>
</html>
widget.js File:
function FUNC1(){
alert("Hello");
}