I have this code:
<body onLoad="subcatSelection();">
The function is inside a .js file which is included with this code:
<script type="text/javascript" src="bincgi/search_lists.js"></script>
The function contains an alert('hello'); just for testing purposes to see if it gets called, but it doesn't.
The "Page error" or whatever its called on the bottom left corner of Explorer 6 is displayed and when double clicking it it assumes there is an error on LINE x ROW y, which is the body-onload event.
Anybody has an ide?
If you need more input let me know... Thanks
UPDATE:
Some html before the onload event...
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="bincgi/search_lists.js"></script>
<script type="text/javascript" src="bincgi/jsfunctions.js"></script>
<script type="text/javascript" src="bincgi/calendar_eu.js"></script>
<link href="bincgi/main_styles.css" rel="stylesheet" type="text/css">
<link href="bincgi/calendar.css" rel="stylesheet" type="text/css">
<!--[if lt IE 8]>
<link href="bincgi/main_styles_ie_lt7.css" rel="stylesheet" type="text/css">
<![endif]-->
<style type="text/css">
body {
background-color: #fffec7;
background-image: url(Graphics/test_bgr.gif);
background-repeat: repeat-x;
}
</style>
</head>
<body onLoad="subcatSelection();">
If [Juriy] answer didn't work, then try calling your function in your page:
<script type="text/javascript" src="bincgi/search_lists.js"></script>
<script type="text/javascript" >
alert("first test");
subcatSelection();
</script>
If that doesn't work, it has to be a trivial problem (e.g., file in wrong location, need to re-start browser, clean cache, etc.)) that is giving you troube.
As far as I see from the comments, the problem might be in the other line of search_lists.js (that might be before subcatSelection definition). IE just stops parsing it and doesn't load the function correctly. Try to leave a single function definition in that file and see what happens:
function subcatSelection() {
alert ("Hello");
}
It may be possible that there's a syntax error that it is avoiding the correct definition of the function. Make that function the only function in your .js file, put your test alert("hello!), and try again.
Check the permissions, you are running inside a cgi bin folder which operates a bit different
I would also suggest not mixing your js files with your CGI (who uses cgi anymore)
Because you have the problem on IE6 only from what I understand, I would try to first use Fiddler to determine if your file is downloaded correctly, if it is then I would modify the content of search_list.js to be:
alert('Before def');
function subcatSelection() {
alert('In subcatSelection');
}
alert('After def');
Then create a page like this to see if you get the alerts in that order: 'Before def', 'After def', 'Before Call', 'In subcatSelection', 'After Call'.
At that point, you should know for sure where is the problem if it's still there. If you don't have the error, then start plugging back the pieces one by one (move the call in body onload then try, re-add the code in search_list.js then try, re-add the other JS includes then try, etc.)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="bincgi/search_lists.js"></script>
<script type="text/javascript">
alert("Before Call");
subcatSelection();
alert("After Call");
</script>
</head>
<body>test</body></html>
Related
I created a Flask App using Pycharm.
I have an inline Javascript function internaltest() which is placed inside a html file. When I click a button, the function is supposed to call an external javascript function, and post an alert. For some reason, instead of running the current code in the Javascript file, it runs the previous code. (see below)
hom2.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link href="/static/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<script src="{{url_for('static', filename='test.js')}}"></script>
<script>
function internaltest(){
externaltest();
}
</script>
<button onclick="internaltest()">clickhere</button>
</body>
</html>
test.js (current version)
function externaltest() {
alert("This is supposed to be running");
}
test.js (previous version)
function externaltest() {
alert("This is NOT supposed to run");
}
I first ran test.js from hom2.html, which worked. Then I changed the alert from test.js and ran hom2.html again. Instead of alerting the new string, it alerts the one before I made the changes.
Directory:
app_code
static
test.js
templates
hom2.html
I would appreciate any help.
I was trying to use Dygraphs in web application. Please see below simple code.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7; IE=EmulateIE9">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>MyHtml.html</title>
<!--[if IE]>
<script type="text/javascript" src="/js/excanvas.js"></script>
<![endif]-->
<script type="text/javascript" src="/js/rgbcolor.js"></script>
<script type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"></script>
<script type="text/javascript" src="/js/dygraph-combined.js"></script>
<script type="text/javascript" src="/js/dygraph.js"></script>
<script type="text/javascript" src="/js/CanvasRenderingContext2D.js"></script>
</head>
<body>
<div id="graphdiv"></div>
<script type="text/javascript">
g = new Dygraph(
document.getElementById("graphdiv"), "Date,Temperature\n" + "2008-05-07,75\n" + "2008-05-08,70\n" + "2008-05-09,80\n");
</script>
</body>
</html>
If i include the line
type="text/javascript" src="http://dygraphs.com/dygraph-combined.js"
with the scripts it works fine in firefox and chrome and it wont work in IE, it gives error like 'CanvasRenderingContext2D' is undefined. If i download the dygraph-combined.js and include it in my web application and access it by giving path, it wont work in all three browsers, it gives an error message Dygraph not defined. Please help me. I want to know why this is happening.
You should only need to include dygraph-combined.js, whether from your website or your own site. Did you include excanvas.js on your site? This could explain why it's not working in IE8.
The problem might be that scripts which are in /js/... are not accessible for any of your browser.
It explains why in the case you refer to remote dygraph-combined.js, only IE doesn't work - it needs excanvas.js referenced from /js/...
In the case you downloaded dygraph-combined.js and replace the remote reference to /js/... then no browser works as they can't access the /js/dygraph-combined.js
Check accessibility of /js/dygraph-combined.js and /js/excanvas.js. Should there be the reference without leading slash e.g.: js/dygraph-combined.js?
And as previously mentioned, remove all other script references (except dygraph-combined and excanvas.js). Dygraph-combined already contains everything in one file and excanvas is needed for IE.
I am trying to delete the first css rule.
However, this does not work in Firefox 3.6.28. Is this the same for everyone and why is this the case?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
$(window).load(function(){
console.log(document.styleSheets);
document.styleSheets[0].deleteRule(0);
console.log(document.styleSheets); // same as the first console.log
});
</script>
<style>
body{font-size:62.5%;}
#mc{padding:310px 0 10px 162px; color:#fff;}
#content{width:500px;}
#header{padding-top:10px;}
#banner{padding:10px 0}
</style>
</head>
<body>
Test JS
</body>
</html>
Update
Just to clarify, the delete seems to be working however the console.log shows the same number of rules before and after the delete.
Seems to work just fine for me
example at http://jsfiddle.net/gaby/JmWwM/
you need to check the length of the cssRules property.
If you log the actual object in firebug then when you try to dig deeper it will show you the current state of the stylesheet, so it will have a reduced number of rules.. (since by the time you start digging the deletion will have occured)
but if you log the actual number of rules before and after the deletion then it will show the correct results..
so the problem is a mistake in understanding how the console.log command works.
According to https://developer.mozilla.org/en/DOM/CSSStyleSheet/deleteRule stylesheet.deleteRule(index) , delete rule accepts an index so your 1 should be a 0.
I created a jsfiddle http://jsfiddle.net/N3zsw/. I had to make some changes to your code since there are other stylesheets on the page so 0 == 3.
It appears to work for me. When you do console.log you should be displaying console.log(document.styleSheets[0]) instead of console.log(document.styleSheets). The CSS
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<style>
body{font-size:62.5%;}
#mc{padding:310px 0 10px 162px; color:#fff;}
#content{width:500px;}
#header{padding-top:10px;}
#banner{padding:10px 0}
</style>
<script type="text/javascript">
(function () {
var s = document.styleSheets[0];
console.log(s.cssRules.length);
s.deleteRule(1);
console.log(s.cssRules.length);
s.deleteRule(1);
console.log(s.cssRules.length);
s.deleteRule(1);
console.log(s.cssRules.length);
s.deleteRule(1);
console.log(s.cssRules.length);
})();
</script>
</head>
<body>
Test JS
</body>
</html>
it is working fine, i think its about firebug's object reference thing
I've got this code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript" href="http://code.jquery.com/jquery-1.5.min.js" />
<title>JQuery Demo 1</title>
<style type="text/css">
#box
{
background-color: #ff0000;
}
</style>
<script type="text/javascript">
</script>
</head>
<body>
<div id="box">----Text----!</div>
</body>
</html>
When I include the Jquery file from Google, the div "box" stops being red. When I remove the JQuery file, it becomes red again. WHY?
Try not using self closing syntax for your script element, e.g.
<script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>
...and the correct attribute to point to a script file is src, not href.
See it on jsFiddle.
In XHTML <script /> means "A complete script element" (note, browsers decide if a document is XHTML or HTML based on the content-type HTTP header, not the Doctype).
In HTML <script /> means "A start tag for a script which starts with a > character", but for historical reasons, it gets treated as "A start tag for a script with a funny attribute that I'll ignore".
So, you have a script element that you open, but it doesn't get closed until the </script> tag for the second script element. The <style> element is inside the script, so it gets treated as JavaScript instead of HTML. Since the script specifies a src the inline script (including the style element) is ignored.
I try to do an AJAX call with jQuery and $.post in Internet Explorer, but all I get is an error saying "Permission denied". The problem is kinda weird since it occurs only when I access a page after I was on any other page.
For instance I type the URL in the adress line and let IE load the page. Then I click on a button so the script should start loading JSON data. (The script providing the data lies on the same server and I access it with a relative URL, so using a different domain is not the problem here. Even tried to use a absolute URL with the same host part.)
But when I refresh the page then and try it again it works! Same thing when I come to that page from another page. At first nothing works, but when I click "refresh" everything is fine.
IE gives me the error message "Permission denied" while in every other browser I don't notice this behaviour. Since I have tried many things and still cannot imagine where the problem lies I'd like to ask you what you think the problem might be?
edit:
A small example:
test.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<script type="text/javascript" src="/ietest/jquery.js"></script>
<script type="text/javascript" src="/ietest/test.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
Test
</body>
</html>
ajax.html
It works!
test.js
$(document).ready(function(){
$( 'a' ).click(function(){
$.post( '/ietest/ajax.html', function( data ) {
alert( data );
});
});
});
Try it here: http://t1318.greatnet.de/ietest/test.html
From the post on jquerys forum here, you have to have the content type meta as the first item in your head tag.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="/ietest/jquery.js"></script>
<script type="text/javascript" src="/ietest/test.js"></script>
</head>
<body>
Test
</body>
</html>
If its local (localhost), then for security reasons you have to have the full path.
In my case, changing the jquery version worked. Instead of using version 1.9.1, now I'm using 1.12.4 and it works.