I have an HTML frameset page (don't judge), where I have used some JavaScript (document.write) to display the tag of a frame with a variable:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>
Title
</title>
<script src="script.js">
</script>
</head>
<frameset cols="70%,30%" frameborder="0">
<frame src="site1.html" />
<script>
document.write('<frame src="site2.html?var=' + variable + '" />');
</script>
</frameset>
</html>
So I can't get this to work. The problem is that, now that I've used JavaScript to document.write the tag for a frame, the frame does not show. How is there a way to successfully incorporate this JavaScript in my frameset?
Related
I inserted some js code (provided by a third party service) in my webpage and it broke my html validation. How can I fix the problem? CDATA isn't doing the trick.
This is my sample snippet:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<script type="text/javascript">
/*<![CDATA[*/
document.write('<script src="//sharebutton.net/plugin/sharebutton.php?type=horizontal&u=' + encodeURIComponent(document.location.href) + '"></scr' + 'ipt>');
/*]]>*/
</script>
</head>
<body>
<p>test</p>
</body>
</html>
And here you can find the result of the validator.
<![CDATA[* is a feature of XML, not HTML. It is just part of the text content of the script element in HTML terms.
To safely include the string </script> in a JavaScript string literal in HTML: Escape the slash:
'"><\/script>')
I think all that's wrong here is your nested block comment. Try this instead...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test</title>
<script type="text/javascript">
/*<![CDATA[
document.write('<script src="//sharebutton.net/plugin/sharebutton.php?type=horizontal&u=' + encodeURIComponent(document.location.href) + '"></scr' + 'ipt>');
]]>*/
</script>
</head>
<body>
<p>test</p>
</body>
</html>
I have the following page with iframes:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<script type="text/javascript">
alert("test");
elements = document.getElementById("reference").contentWindow.getElementLength();
alert("test2");
</script>
</head>
<frameset cols="20%,*">
<frameset rows="25%,*">
<frame src="./groups.html" name="types">
<frame src="./entities.jsp" name="entities">
</frameset>
<frame src="./reference.jsp" name="reference" id="reference">
</frameset>
</html>
Inside reference.jsp, I have the following code :
<html>
<head>
<script type="text/javascript">
function getElementLength(){
alert("in reference");
elements=document.getElementByClassName("link");
alert(elements.length);
}
</script>
</head><body>...</body></html>
I checked earlier StackOverflow posts about using Javascript across frames and found that contentWindow does the trick but in this case, I only get first alert - "test" and the frame with id="reference" is never reached. I see the following error in Firebug:
document.getElementById("reference") is null
elements = document.getElement...").contentWindow.getElementLength();
Is there something I am missing, this seems to be a very straighforward usecase.
I think that the problem is that your script is executing before the frame is loaded ...
You could do the following to ensure the frame is loaded before the script is executed :
<script type="text/javascript">
function load() {
alert("test");
elements = document.getElementById("reference").contentWindow.getElementLength();
alert("test2");
}
</script>
<frameset cols="20%,*">
<frameset rows="25%,*">
<frame src="./groups.html" name="types">
<frame src="./entities.jsp" name="entities">
</frameset>
<frame src="./reference.jsp" name="reference" id="reference" onload="load()">
</frameset>
I have added the onload="load()" attribute in the frame reference and wrapped your script in the load() function. This will cause the code to be executed once the reference frame is loaded.
Your document type is transitional which isn't support the framset
try the below document type tag
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
I try to capture onkeydown event in a window wich contains a iframe containing mutliple framset :
top.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> top.html </title>
</head>
<body>
<iframe frameborder="0" border="0" width="100%" height="100%" src="framset1.html" id="framset1"></iframe>
</body>
framset1.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>A frameset document</TITLE>
</HEAD>
<FRAMESET rows="66,*" border="0">
<FRAME scrolling="no" id="frame1" name="frame1" src="frame1.html">
<FRAME id="framset2" name="framset2" src="framset2.html">
</FRAMESET>
</HTML>
framset2.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<HTML>
<HEAD>
<TITLE>A frameset document</TITLE>
</HEAD>
<FRAMESET cols="46,*" border="0">
<FRAME scrolling="no" id="frame2" name="frame2" src="frame2.html">
<FRAME id="frame3" name="frame3" src="frame3.html">
</FRAMESET>
</HTML>
I want to capture event onkeydown in frame3. I have found a relative question on stackoverflow here but applied without succes.
Do i have to continue on this way or anyone can help me.
Thanks.
Paul
If you want to assign the event listener in the top frame (top.html):
document.getElementById('framset1').contentDocument.getElementById('framset2').contentDocumentcontentDocument.getElementById('framset3').contentDocument.addEventListener('keydown', function(e) {
alert('keydown in frame 700');
}, false);
This only works if all frames are on the same domain + port. Otherwise you'll get a security exception trying to access document.getElementById('framset1').contentDocument.
But frames within frames within frames... Is that what you really want??
I have iframe that cointains some javascript that should fire on body load,while iframe works fine when embedded on plain HTML page,when integrated in blogger HTML/javascript widget,javascript in iframe don't work..suggestions.Tried only in Firefox bc viruses and toolbars eaten IE?
Iframe Page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script language="javascript" type="text/javascript">
function change() {
var text = "someaddress";
window.location = "http://something.com/fb2.aspx" + "?url=" + text;
}
</script>
</head>
<body bgcolor="#333333" onload="change()">
</body>
</html>
Code of HTML/javascript widget on Blogger Blog
<iframe scrolling="no" src="http://something.com/fb.htm" width="200" height="70"
frameborder="0" name="myInlineFrame"></iframe>
And sam iframe embedded in this plain HTML page executes javascript as it should
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test Stats page</title>
</head>
<body>
<iframe src="fb.htm" runat="server" id="iframe1" width="500" height="500"></iframe>
</body>
</html>
Behind the scenes, it appears that the Blogger Widget/Gadget system is using a method of adding code to the DOM that precludes the execution of any JavaScript. Oftentimes, this can happen if content is added by appending it to the .innerHTML object. The DOM element is rendered, but any included JavaScript does not execute.
A workaround for this is outside the scope of this question, because it's a blogger issue.
The solution for you is to edit the Blogger template directly, and paste your IFRAME where you would like it to appear in the template itself. In other words, don't use a widget.
Below is a portion of my own Blogger Template with an iframe right before the closing body element:
</div>
</div>
</div>
<script type='text/javascript'>
window.setTimeout(function() {
document.body.className = document.body.className.replace('loading', '');
}, 10);
</script>
<!-- Iframe in template -->
<iframe scrolling="no" src="http://somedomain.com/fb.htm" width="200" height="70"
frameborder="0" name="myInlineFrame"></iframe>
<!-- Iframe in template -->
</body>
<macro:includable id='sections' var='col'>
<macro:if cond='data:col.num == 0'>
<macro:else/>
I have images on a webpage that I want to have linked to another website, but in a new window of a certain size. In Dreamweaver, I used Window > Behaviors > onMouseClick, but for some reason, that isn't working. The image isn't recognized as a link.
Is there any other way I can have it open a link in a new window of a set size, and actually have it work this time?
Here is the code produced by Dreamweaver:
<script language="JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
The link:
<img src="images/portfolio/featured1.jpg" alt="Google" width="241" height="200" border="0" onclick="MM_openBrWindow('http://www.google.com','google','scrollbars=yes,width=650,height=500')" />
Well, this works for me in Opera. It's valid HTML, too.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Test popup</title>
</head>
<body>
<script type="text/javascript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<p>the link:
<img src="notice.png"
alt="Google"
width="241" height="200"
style="border: 0;"
onclick="MM_openBrWindow('http://www.google.com','google','scrollbars=yes,width=650,height=500')">
</body>
</html>
And this is better:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<title>Test popup</title>
</head>
<body>
<script type="text/javascript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<p>the link:
<a href="http://www.google.com" onclick="MM_openBrWindow('http://www.google.com','google','scrollbars=yes,width=650,height=500'); return false;">
<img src="notice.png"
alt="Google"
width="241" height="200"
style="border: 0;"></a>
</body>
</html>
It's better because (a) there's a link, so you'll see the "hand" icon for the mouse; and (b) the link actually goes somewhere, so people with javascript turned off can still get to the content. (The "return false" on the "onclick" attribute means that people with javascript turned on only get the popup link. The "false" stops the browser following the normal link.)