Menu
I'm new to Javascript and am learning the basics via a textbook that focuses on its applications in IE 7+ and Firefox 2+. However, I am using Chrome and am getting the following error when running the program given in the book: "blocked a frame of origin 'null' from accessing a cross-origin frame." Can anyone tell me what is causing the error and how I can fix it? The two programs are below.
//This is the program being loaded into the browser <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Example</title> <script type="text/javascript"> function calcFactorial(factorialNumber){ var factorialResult = 1; for(;factorialNumber>0;factorialNumber--) factorialResult *= factorialNumber; return factorialResult; } </script> </head> <frameset cols="100%,*"> <frame name="fraCalcFactorial" src="calcfactorial.htm"/> </frameset> </html> Below is the src file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Example</title> <script type="text/javascript"> function butCalculate_onclick(){ try{ if (window.top.calcFactorial == null) throw "This page is not loaded within the correct frameset"; if (document.form1.txtNum1.value == "") throw "!Please enter a value before you calculate its factorial"; if (isNaN(document.form1.txtNum1.value)) throw "!Please enter a valid number"; if (document.form1.txtNum1.value < 0) throw "!Please enter a positive number"; } catch(exception){ if (typeof(exception) == "string"){ if (exception.charAt(0) == "!"){ alert(exception.substr(1)); document.form1.txtNum1.focus(); document.form1.txtNum1.select(); } else alert(exception); } else alert("The following error occurred: " + exception.message); } } </script> </head> <body> <form action="" name="form1"> <input type="text" name="txtNum1" size="3" /> factorial is <input type="text" name="txtResult" size="25" /><br/> <input type="button" value="Calculate Factorial" name="butCalculate" onclick="butCalculate_onclick()" /> </form> </body> </html> 
761
For the same-origin policy browsers block scripts trying to access a frame with a different origin. Origin is considered different if at least one of the following parts of the address isn't maintained: protocol://hostname:port/...
This happens because Chrome doesn't allow frames from your hard disk to access each others' content. Which, technically we term as Cross-origin request.
Solution of the above problem is:
1. Either you host your webpage on a local web server. See the following link:
What is a faster alternative to Python's http.server (or SimpleHTTPServer)?
2. Use any other browser like Firefox
111
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
