javascript : to fetch iframe element ,but it can not get the value - javascript

i try to fetch the frame head value ,but it doesn't work well,look at the following code
1.php
<iframe src="/admin/" ></iframe>
<script type="text/javascript">
// var a =
a = window.top.frames[0].a
alert(a)
</script>
/admin/index.php
<script type="text/javascript">
document.cookie = 'a=asdf';
a = 'asdf'
</script>
Look the result
when i open http://127.0.0.1/1.php in firefox or chrome it become that followings
open in browser
but when i execute it in the console it come into that
enter image description here
so My question is Why my code can't get the value of Tag iframe

You need to wrap your code under window load function or may be iframe load because iframe takes some time to load and you have to wait for it to be fully loadded.
<iframe src="/admin/" ></iframe>
<script type="text/javascript">
window.onload=function(){
// var a =
a = window.top.frames[0].a
alert(a)
}
</script>

Related

How to load iframe exactly one time if onload is present?

I am trying online on the fly when page reloads based on the userid. For that I am doing
<body>
<iframe frameBorder="0" id="res" src="" height="500" width="500" onload="doit()"></iframe>
</body>
<script>
function doit(){
var t = location.search.split('=')[1]; // get userid from the current page
document.getElementById('res').src="./profile/?id="+t;
}
</script>
but the problem is it will keep recursive querying the /profille/?id={id} due to onload . I need to fire onload exactly one time after body is loaded. How is it possible?
Add flag to save loading state
<script>
var loaded = false;
function doit(){
if (loaded) return;
var t = location.search.split('=')[1]; // get userid from the current page
document.getElementById('res').src="./profile/?id="+t;
loaded = true;
}
</script>

Open iFrame links in a new tab?

I have endlessly tried to open iframe links inside either the parent tab or a new tab however I just can't seem to get them to work. When I set the links to target="_parent" the links do nothing and when I set the links to target="_blank" they open in a new tab but also display nothing.
As soon as I get rid of the code that adds the target to the links they work but open inside the iframe which is not what I am trying to accomplish. Any help would be greatly appreciated.
Here is the iframe code that I am using:
<iframe src="js/eventsFrame2.php?EventID=2422308" id="frameclass" frameborder="0" scrolling="no" width="100%" height="600">
Here is the code inside the iframe:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
function myFunction() {
$("a").attr('target','_parent');
}
$(window).load(myFunction);
</script>
<script language="javascript" type="text/javascript">
document.write('<script language="javascript" src="http://tickettransaction.com/?bid=1761&sitenumber=18&tid=ticket_results&evtid=2422308"><\/script>');
</script>
If you have control over the content inside the iframe, you could try using the base tag.
Example -- In the page loaded into the iframe include a base tag within the head:
<base target="_top"/>
Have you tried overwriting the parent page (containing the iframe) with your content?
Code inside the iframe:
<script language="javascript" type="text/javascript">
parent.document.write('<script src="http://tickettransaction.com/?bid=1761&sitenumber=18&tid=ticket_results&evtid=2422308"><\/script>');
</script>
Query defines the contents() method to grab the document node, but it doesn't give you a cross-browser way to go from the document to the window, so you're still stuck with:
var iframea = $('iframe').contents().find("a");
iframea.attr('target','_parent');
IMPORTANT: you should always check that the document is with the status "complete" for work with this
var iframe= document.getElementById('iframe_id');
//var iframewindow= iframe.contentWindow
//? iframe.contentWindow : iframe.contentDocument.defaultView;
var preview = previewFrame.contentDocument || previewFrame.contentWindow.document;
if (preview.readyState=="complete")
{
//ok
}
else
{
//perform a recursive call until it is complete
}

iframe src to be massaged by javascript

To say that I am a novice in javascript is an insult to a novice. Even my limited HTML knowledge is self-taught. Here's my problem: I am trying to massage the src in a simple iframe, like so:
<html>
<head>
<script type="text/javascript">
function embedKey() {
var url = window.location.href;
var symbol = url.split('?')[1];
if(symbol=="INNO"){
uniqueKey = "&resid=27A14C5DE396792C%21235&authkey=ANDfOBKrOKskLqg"
return "https://skydrive.live.com/embed?cid=27A14C5DE396792C" + uniqueKey +"&em=2&wdAllowInteractivity=False&ActiveCell='Sheet1'!B3&wdHideGridlines=True&wdHideHeaders=True"
}
else {
alert(url);
return false;
}
}
</script>
</head>
<body>
<iframe width="402" height="346" frameborder="0" scrolling="no" src=javascript:embedKey();></iframe>
</body>
</html>
I will be adding many more conditions/symbols/return strings to the embedKey() function. Right now, I am trying to make it work with one.
I don't think JavaScript gets executed from a src attribute like that. With something like an href attribute on an a element (where one often sees inline JavaScript) there's at least a click event to respond to, but not in this case.
Instead of trying to call the function inline from the element like that, call it from a script block after the element has loaded. Something like this:
<iframe width="402" height="346" frameborder="0" scrolling="no" id="someIframe"></iframe>
<script type="text/javascript">
document.getElementById('someIframe').src = embedKey();
</script>

Cross domain iframe src changes

I have an application which contains an iframe. I can modify the contents of the iframe, but not the whole page itself, e.g.:
<html><head></head>
<body>
<iframe>
<!-- my code -->
</iframe>
</body></html>
I have a requirement in which I need to change contents of the iframe to a different page (possibly on a different domain) and go back. Currently I do it like this:
The first page (it is inside the iframe executionPanelApplications):
<html>
<head>
<script type="text/javascript">
function replaceIFrameUrl() {
var doSubmit = "<c:out value='${param.doSubmit}'/>";
if (doSubmit == 1) {
document.forms['testForm'].submit();
}
else {
var adfUrl = "<fuego:fieldValue att='instJs.adfUrl' onlyValue='true'/>";
var bpmSrc = parent.document.getElementById('executionPanelApplications').src;
var bpmSrcParams = bpmSrc.split('&');
var activityId = (bpmSrcParams[1].split('='))[1];
var url = adfUrl +"&actionType=0&activityId="+activityId;
parent.document.getElementById('executionPanelApplications').src = url;
}
};
</script>
</head>
<body onload="replaceIFrameUrl();">
<form method="post" id="testForm" name="testForm" />
</body>
</html>
The second page (it should be inside the iframe executionPanelApplications as well):
<script>
function leave(e) {
var iframe = parent.parent.document.getElementById("executionPanelApplications");
iframe.src = url;
};
</script>
If both sites are in localhost it works like a charm. Unfortunatelly if they are in different domains - the second page is opened in a new window. Tested in ie 8. As i said - i can't change the contents of the page that contains the iframe. I can only work from inside the iframe. I need this to work only in ie.
Any ideas?
I would not use iframes, because there are different security restrictions (cross domain communication)
But I think, this one can help you: http://softwareas.com/cross-domain-communication-with-iframes

Doing popups correctly

Basically I have a website that offers a help system. When activated this help system triggers a popup in which the help content appears.
As the users then navigates around the site, through the use of a cookie I detect (that I set when the window is first opened and clear when the user closes the window) whether the window is still opened and load new help content for the new page.
As it turns out the only way to load new content into this popup window is to pop open a new page with the same name (so that we don't multiple popups opening everywhere) with the desired content.
This works fine the first time the user triggers the popup, but after that when I try and automatically try and pop open a window, I have problems with most browsers.
Just wondering if anyone has any ideas on how I can get this to work correctly?'
UPDATE
#Rob
Here is that I have:
Page1.html
<html>
<head>
<script type="text/javascript" src="MainPopup.js"></script>
</head>
<body>
<h1>Page 1</h1>
Next
Click
<script type="text/javascript">popupWindowIfCookieSet('Help1.html');</script>
</body>
Page2.html
<html>
<head>
<script type="text/javascript" src="MainPopup.js"></script>
</head>
<body>
<h1>Page 2</h1>
Prev
Click
<script type="text/javascript">popupWindowIfCookieSet('Help2.html');</script>
</body>
</html>
</html>
Help1.html
<html>
<head>
<script type="text/javascript" src="Helper.js"></script>
</head>
<body>
<h1>Help 1</h1>
</body>
</html>
Help2.html
<html>
<head>
<script type="text/javascript" src="Helper.js"></script>
</head>
<body>
<h1>Help 2</h1>
</body>
</html>
MainPopup.js
var windowLocation;
function setHelperWindow(new_windowLocation){
windowLocation = new_windowLocation;
}
function popup(url){
try{
windowLocation.href = url;
} catch(e){
windowLocation = window.open(url, "HelperWindow").location;
}
}
function popupWindowIfCookieSet() {
//Stuffhere
}
function setPopupActiveCookie() {
//Stuffhere
}
Helper.js
(function(){
var failures = 10*60; //Cancel poller after 1 minute without `opener`
var poller = setInterval(function(){
try{
// Attempt to send the current location object to window.opener
window.opener.setHelperWindow(location);
}catch(e){
if(!window.opener && failures-- < 0) clearInterval(poller);
}
}, 100);
})();
Unfortunately this doesn't work. What should happen is that if i pop open the Helper page from Page1, when I then go to Page2.html, the popup window showing the Help1.html content would switch to Help2.html.
Currently its not doing this. Any ideas.
If your whole website is hosted at the same domain, you can use the window.opener property, in conjunction with some adjustments at your page.
Main: Declare a variable windowLocation, and functions setHelperWindow and popup
Main-popup: Open a new window, and store a reference in variable windowLocation
Helper-window: Create a poller, which attempts to invoke the setHelperWindow of the window.opener object. If the window.opener window has closed, the poller will terminate.
Because the windowLocation variable is getting updated all the time (either after using window.open() or by the poller function in the popup), the possibility of getting blocked by a popup blocker is reduced severely.
Note: Both scripts has to be included at each main and helper page:
<script src="filename.js"></script>
Helper.js
(function(){
var failures = 10*60; //Cancel poller after 1 minute without `opener`
var poller = setInterval(function(){
try{
// Attempt to send the current location object to window.opener
window.opener.setHelperWindow(location);
}catch(e){
if(!window.opener && failures-- < 0) clearInterval(poller);
}
}, 100);
})();
MainPopup.js
var windowLocation;
function setHelperWindow(new_windowLocation){
windowLocation = new_windowLocation;
}
function popup(url){
try{
windowLocation.href = url;
} catch(e){
windowLocation = window.open(url, "HelperWindow").location;
}
}
Example: Usage (main)
Click
Specifying a name for the window like you have done should work, e.g.
window.open('help1.html', 'help');
Then, e.g. when page2 loads,
$(function () {
window.open('help2.html', 'help');
});
Bear in mind though that the popup blocker is going to stop this behaviour from working unless you add an exception. E.g. in chrome, options >> under the bonnet >> content settings >> pop-ups >> manage exceptions.
Disclaimer: I'm not a fan of using popups and would use a lightsout box instead for your online help, loading the content via an ajax request.

Categories

Resources