5

I made a little web-based web browser for a web-based OS I made. I noticed that in some sites, they have links that like to open in new tabs. Is there a way that this can be prevented and have the links open in the iframe instead?

Here's my code for the whole browser just in case:

<html>
<head>

<link href="./browser.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript"  src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script>
$(function() {
$("#load").click(function() {
var new_url = $("#url").val();

// Checks that the user typed "http://" or not
if(new_url.substr(0,7)!="http://")
new_url = "http://"+new_url;

$("#main_frame").attr("src", new_url);
});
});
</script>
</head>
<body>

<div id="help">
<form action="help.html"><input type="submit" value="Help"></form>
</div>

Address:
<div id="logo">
<img src="stallion.png">
</div>
<input type="text" style="width: 400px;" name="url" id="url">
<input type="button" value="Go" id="load">

<div>
<input type="image" src="back.png" height=25 width=25 onclick="back()">
<input type="image" src="forward.png" height=25 width=25 onclick="forward()">
<input type="image" src="refresh.png" height=26 width=26 onclick="refresh()">
</div>

<iframe frameborder=0 class="netframe" src="http://www.bing.com/" id="main_frame"></iframe>

</body>
<script>
function back()
{
window.history.back();
}
</script>

<script>
function forward()
{
window.history.forward();
}
</script>

<script>
function refresh()
{
var iframe = document.getElementById('main_frame');
iframe.src = iframe.src;
}
</script>

</html>
UltraStallion
  • 131
  • 1
  • 3
  • 10

3 Answers3

1

There is two choices

1 : You can check all of the html in the iframe on each change and look for "target=_blank" and if so replace with "target=_self"

2 : Which I think would be the better way is, when the user clicks on an anchor tag check to see if the anchor has the attribute "target=_blank" if they do, simply remove it and then click the link.

I have provided a jsFiddle below

https://jsfiddle.net/L5dhp80e/

Html

<a class="newTab" href="http://www.google.com" target="_blank">
    New Tab Google
</a>

<br />
<a class="removeBlank" href="http://www.google.com" target="_blank">
    Removed Target Blank Google
</a>

Javascript

$(function () {
    $('a.removeBlank').on('click', function () {

        if ($(this).attr('target') == "_blank") {
            $(this).attr('target', '_self');
        }

        $(this).click();

        return false;
    })
});

However if the iframe content is cross domain I don't think you can edit any of the code at all.

Get DOM content of cross-domain iframe

Community
  • 1
  • 1
Canvas
  • 5,779
  • 9
  • 55
  • 98
-1

I found this answer in the web:

window.open = function (url, name, features, replace) {
    document.getElementById('#iframe').src = url;
}

or with jQuery:

window.open = function (url, name, features, replace) {
    $('#iframe').attr('src', url);
}

I haven't already tested it, but i hope it works.

Cisc
  • 142
  • 1
  • 5
-2

Add target="_self"

<iframe src="http://google.com" target="_self"></iframe>

Target Attributes are:

_self = Opens the linked document in the same frame as it was clicked (this is default)

_blank = Opens the linked document in a new window or tab

_parent = Opens the linked document in the parent frame

_top = Opens the linked document in the full body of the window

framename = Opens the linked document in a named frame

Information from:

http://www.w3schools.com/tags/att_a_target.asp

jdnoon
  • 1,845
  • 3
  • 15
  • 18