[JS] Wie Browser im Browser simulieren? (mit Textbox für URL-Eingabe)

annie548 · 03.10.2006

Hallo,
eigentlich dachte ich, dass man ein Script wie das, welches ich suche, ziemlich leicht bekommt - da habe ich mich wohl getäuscht. Oder es ist soooo simpel, dass jeder davon ausgeht, man wüsste, wie man es macht.
Hmmm...
Hier meine Frage:

Ich habe eine Textbox und einen "enter"-Button. Wenn man nun eine URL in die Textbox eingibt und "enter" klickt, soll in einem anderen Frame eben diese URL aufgehen.
Quasi ein "Browser im Browser" - genau das soll es werden.

Habe auch ein Script gefunden, welches allerdings nur im IE funktioniert:
(mit Textfeld "location") und Button "Go")

Code:

[COLOR="DarkGreen"]<form name=addrForm>
<input type=text name=location value="Type any URL here then press Go" onFocus="this.value=''" size=35> 
<input type=button value="Go" 
onClick="setLayer(document.addrForm.location.value)">
</form>[/COLOR]

Wie kann ich es modifizieren, damit es auch in Safari funktioniert? Oder geht das gar nicht? Oder hat jemand eine andere Idee?

Manjo · 03.10.2006

Wie schaut denn die Funktion "setLayer" aus?

cordney* · 03.10.2006

Kann man direkt im onClick-Handler machen:

Code:

onClick="javascript:parent.framename.location.href = document.addrForm.location.value"

Wenn ich mich recht erinnere..

annie548 · 03.10.2006

Hallo, das eigentliche Script hatte ich wohl vergessen...

Also, komplett steht da folgendes...

Code:

[COLOR="Indigo"]<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function writeLayer(text) {
document.frames['myFrame'].location.href = text;
document.addrForm.location.value = text;
}
function setLayer(text) {
if (text.indexOf("http://",0) <= 0)
text = "http://" +text;
document.frames['myFrame'].location.href = text;
document.addrForm.location.value = text;
}
return true;
}
//  End -->
</script>
</HEAD>

<BODY>
<iframe src="about:blank" width=100% height=90% id=myFrame></iframe>
<center>
<form name=addrForm>
Location:
<input type=text name=location value="Type any URL here then press Go" onFocus="this.value=''" size=35> 
<input type=button value="Go" onClick="setLayer(document.addrForm.location.value)">
</form>
</center>
</BODY>
</HTML>[/COLOR]

@cordney: Das ging irgendwie nicht... hmmm... schade, trotzdem danke!

ThaHammer · 04.10.2006

document.frames['myFrame'].location.href = text;

Sollte das nicht

document.frames.myFrame.location.href = text;

so heissen? Aber ganz sicher bin ich mir jetzt nicht, habe auch nicht nachgeschaut.

annie548 · 04.10.2006

Hallo

(Sorry, das musste ich einfach tun...

)

Habe die Zeilen (2 Stück) nach Deiner Idee geändert, geht aber leider immer noch nicht. Komisch, ich dachte, das hätten bestimmt schon tausend Leute gemacht und so ein Script ist ein alter Hut... Ist echt schwer, im Netz was darüber zu finden (wahrscheinlich scheitert's auch an den Suchbegriffen - habe bis jetzt immer "URL in Textbox" oder "Browser simulieren", "Browser in Browser", "Simulate Browser" etc. benutzt)

Vielleicht sollte ich es lieber im Flash machen?

Difool · 04.10.2006

Hi annie,
setzt du bitte html & co in die Forumseigenen

Code:

-tags. :)

annie548 · 04.10.2006

Upps, sorry - klar, mach' ich.

Manjo · 04.10.2006

Mach mal so:
(ungetestet)

HTML:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function setLayer() {
var loc_id = document.getElementById('location');
if (loc_id.value.indexOf("http://",0) <= 0)
loc_id.value = "http://" +loc_id.value;
document.getElementById('myFrame').location.href = loc_id.value;
}
//  End -->
</script>
</HEAD>

<BODY>
<iframe src="about:blank" width=100% height=90% id="myFrame"></iframe>
<center>
<form>
Location:
<input type=text id="location" value="Type any URL here then press Go" onFocus="this.value=''" size=35> 
<input type=button value="Go" onClick="setLayer()">
</form>
</center>
</BODY>
</HTML>

b.legt210 · 04.10.2006

oder so (getestet und etwas geändert):

Code:

<html>
<head>
<script language="JavaScript">
//<!-- Begin
	function setLayer(text)
	{
		//alert("Text: " + text);
		//alert("Frame-SRC:\n" + parent.myFrame.location.href);
		parent.myFrame.location.href = text;
	}
//  End -->
</script>
</head>

<body>
<iframe src="about:blank" width="100%" height="90%" id="myFrame" name="myFrame"></iframe>
<center>
<form name="Testform" action="">
	<input type="text" name="my_location" id="my_location" value="http://www.apple.de">
	<input type="button" value="GO !!!" onclick="setLayer(document.Testform.my_location.value)">
</form>
</center>
</body>
</html>

annie548 · 04.10.2006

Es funktioniert!!!

Hahaaaaaa, es funktioniert! Yippeeeeeh!!! :freu:

DANKEEEEEEEEEEEEE Euch allen für Eure Mühe!!!!

*happyhappyhappy*

annie548 · 04.10.2006

(nerv)
Äh, eine Frage hätte ich da trotzdem noch...
Funktioniert alles super (Script von b.legt) - ausser einer klitzewinzigen Sache:
Gibt man eine URL ein und drückt dann den "Go"-Button (den ich bei mir durch ein Image ersetzt habe), erscheint die geforderte Seite auch ohne Probleme (bei mir statt im iFrame in einem bestimmten Frame des Framesets), aber die "Original"-URL, die scriptseitig als "Startseite" eingetragen ist (in b-legt's Script "www.apple.de") wird wieder in der URL-Textbox angezeigt.
Gibt es einen Weg, die aktuelle Seite anzuzeigen? (Also wie im Browser?)
Oder die URL dann auszublenden, dass praktisch ein weisses Feld dort ist?

Habe versucht, im Script die URL wegzulassen (bzw. value="http://"), aber wenn man die Seite dann aufruft, erscheint so eine komische Seite im Target-Fenster "Herzlichen Glückwunsch, Sie haben Apache erfolgreich installiert" oder so (????$$/$&$???)

EDIT: Habe das Ganze mal zum Probieren hochgeladen...

b.legt210 · 05.10.2006

Hi annie,

das liegt wohl an deinen "return true" bzw. an einem href="#". Dadurch wird auch dein "Eingabe-Frame" neu geladen, was ja unnötig ist.

Manjo · 05.10.2006

Ich löse das meist so:

HTML:

<form action="" method="post" name="Testform" onSubmit="return setLayer(document.Testform.my_location.value)">
	<input type="text" name="my_location" id="my_location" value="http://www.apple.de">
<input type="submit" value="Go" />

HTML:

<script language="JavaScript">
<!-- 
	function setLayer(text)
	{
		parent.myFrame.location.href = text;
		return false;
	}
-->
</script>

annie548 · 05.10.2006

Aha!
Habe jetzt ein "return false" eingefügt, und jetzt funktioniert es!
Vielen Dank!!!

:bunny:

[JS] Wie Browser im Browser simulieren? (mit Textbox für URL-Eingabe)

annie548

Aktives Mitglied

Manjo

Aktives Mitglied

cordney*

Aktives Mitglied

annie548

Aktives Mitglied

ThaHammer

Aktives Mitglied

annie548

Aktives Mitglied

Difool

MU Team

annie548

Aktives Mitglied

Manjo

Aktives Mitglied

b.legt210

Mitglied

annie548

Aktives Mitglied

annie548

Aktives Mitglied

b.legt210

Mitglied

Manjo

Aktives Mitglied

annie548

Aktives Mitglied