I'm currently using an IFrame to sandbox user generated content on a website. This eliminates any styling issues with our main stylesheets.
However, when a user generates a link using our rich text editor, we would like the link to open in the parent and not just open the link in the IFrame. I realize you can set a target to the parent, but we do not have control of the user and what they enter in their content.
Is there any way to hijack the HREFs inside the IFrame so they all target parent without modifying them? Or use a bit of Javascript that could be injected universally so I do not need to scrape through all of the content and replace the target programatically?
Ideally a simple script in one spot would be the best solution.
Thoughts?
END SOLUTION
I used a variation of the answer I selected... It got me in the right direction.
<script>
Event.observe(window, 'load', function() {
$$('a').each(function(e) {
e.writeAttribute('target', '_parent');
});
});
</script>
That's inside the IFrame with the content. It ended up being the most simple solution for the task.
I'm currently using an IFrame to sandbox user generated content on a website. This eliminates any styling issues with our main stylesheets.
However, when a user generates a link using our rich text editor, we would like the link to open in the parent and not just open the link in the IFrame. I realize you can set a target to the parent, but we do not have control of the user and what they enter in their content.
Is there any way to hijack the HREFs inside the IFrame so they all target parent without modifying them? Or use a bit of Javascript that could be injected universally so I do not need to scrape through all of the content and replace the target programatically?
Ideally a simple script in one spot would be the best solution.
Thoughts?
END SOLUTION
I used a variation of the answer I selected... It got me in the right direction.
<script>
Event.observe(window, 'load', function() {
$$('a').each(function(e) {
e.writeAttribute('target', '_parent');
});
});
</script>
That's inside the IFrame with the content. It ended up being the most simple solution for the task.
Share Improve this question edited Aug 4, 2009 at 1:09 mwilliams asked Aug 4, 2009 at 0:22 mwilliamsmwilliams 9,97813 gold badges52 silver badges71 bronze badges4 Answers
Reset to default 6Same domain in the iframe? Yes.
<script type="text/javascript">
function hijacklinks(iframe){
var as = iframe.contentDocument.getElementsByTagName('a');
for(i=0;i<as.length;i++){
as[i].setAttribute('target','_parent');
}
}
</script>
<iframe src="http://example./test.html" onload="hijacklinks(this)"></iframe>
Different domain in the iframe? No.
<iframe src="http://www.google./search?q=google+happy" onload="hijacklinks(this)"></iframe>
yields a "Permission denied to get property HTMLDocument.getElementsByTagName".
There may be ways around, but at least with simple JavaScript their are some protections against iframes mucking with sites (imagine a malicious frame around a bank's website and you can understand why).
Use this to create it and you'll have access to any parts with the $body variable:
$(function() {
var $frame = $('<iframe style="width:200px; height:100px;">');
$('body').html( $frame );
setTimeout( function() {
var doc = $frame[0].contentWindow.document;
var $body = $('body',doc);
$body.html('<h1>Test</h1>');
}, 1 );
});
So you can then do something like this
$('a', $body).attr('target', '_parent');
Found here: http://groups.google./group/jquery-en/browse_thread/thread/fb646741a6192540
Simplest answer:
<head>
<base target="_blank">
</head>
I got around the cross domain issue via ajax..
function runAjaxDone(response) {
$('body').html(response);
}
function callAjax(url) {
$.ajax({ url: url + '&r=' + Math.random(), success: runAjaxDone });
return false;
}
<a runat="server" href="#"
onclick='<%# "callAjax(\"http://partners.thevoiceinternet./portal/Customer/Report/AgentReport.aspx?AgentID="+Eval("AgentID").ToString()+"&name="+Server.UrlEncode(Eval("SubAgentName").ToString())+"\"); return false;" %>'>
<asp:Label ID="lbl" runat="server" Text='<%# Eval("SubAgentName") %>'></asp:Label></a>
Since the parent frame cant be accessed, I replaced the body via ajax.