✔ Wie schreibt man einen Link im Select Tag damit es sich im Frame öffnet?

Status
Nicht offen für weitere Antworten.
son gohan

son gohan

Erfahrenes Mitglied
Hallo, habe gesehen im Internet das jemand durch anklicken einer Auswahl im Secelt tag eine neue Seite im Iframe ladet.

Leider ging das bei ihm durch eine javascript Datei die ich nicht habe um es nach zu machen.

Im Select Tag gebe ich zurzeit das ganze so an.

<option value="impressum.html">Impressum</option>

damit wird die impressum.html geladen. aber ich möchte das sich die impressum.html Seite im iframe öffnet, welches auch auf der gleichen Seite ist.

Hier bedarf es einen kleines Trick mit meiner Meinung Javascript. Wer kann mir ein Beispiel zeigen?
 
Hi,

mach doch nicht ständig Threads zu (fast) den gleichen Fragen auf!

Hier habe ich Dir schon gezeigt, wie Du mit JS in einem Select-Control zu einer neuen Seite navigierst. Um das ganze in einem Frame zu öffnen, ist nur eine kleine Änderung nötig (und diese zusätzliche Frage hättest Du auch ruhig in diesen Thread posten können).
HTML: 
onChange="document.getElementById('frame-id').location=this.value"

Im Übrigen wären diese Threads im JavaScript besser aufgehoben als bei HTML.

Gruß
.
 
Hallo Datic, schuldige bitte, ich habe meinen Post die ganze Zeit gesucht aber nicht gefunden gahbt und deswegen nur nochmal ein geöffnet.


Ich habe es eben mal probiert, es hat aber leider nicht geklappt. Ich will ja das die adresse sich im iframe auf der gelichen Seite öffnet.

Das iframe hat den Namen main bekommen und auch im Script hab ich es reingeschrieben, aber irgendwie geht nicht, schau dir bitte mal meinen Code an:

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html lang="de">
<head>
<title>Herzlich willkommen</title>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<style type="text/css">
<!--
html
{
height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0; background-color:#fff; background:url(images/hinter123.jpg) #fff; background-position:-18px 0; font-size:76%; font-family:georgia, palatino linotype, times new roman, serif;
}
body
{
height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0;
}
#sub
{
float:left;border-width: 0px; border-color: #005F00; border-style: ridge;width:160px;color:#FFFFFF; font-size:12px;text-align:center;margin-left:100px;margin-top:30px;
}
#comtent2
{
overflow:hidden; position:absolute; z-index:3; top:86px; bottom:0px; left:0px; right:0;
}
* html #comtent2
{
top:0; left:0; right:0; bottom:0; height:100%; max-height:100%; width:100%; overflow:hidden; position:absolute; z-index:3; border-top:86px solid #fff; border-bottom:0px solid #fff; border-left:0px solid #fff;
}
-->
</style>
</head>
 
<body>
<div id="head2">
<div id="sub">
<form>
<select name="select" onChange="document.getElementById('main').location=this.value">
<option selected>Seite aussuchen </option>
<option value="impressum.html">Impressum</option>
<option value="kontakt.html">Kontakt</option>
<option value="willkommen.html">Home</option>
</select>
</form>
</div>
</div>
 
<div id="comtent2">
<iframe scrolling="yes" ALLOWTRANSPARENCY="true" marginheight="10" marginwidth="10" frameborder="0" name="main" height="100%" width="100%" src="willkommen.html">
</iframe>
</div>
 
</body>
</html>
gruß
feh
 
Hi,

erstens musst Du dem iframe bei dieser Vorgehensweise eine ID verpassen:
HTML: 
<iframe id="main" ...

und zweitens ist mir m.E. ein Fehler unterlaufen: Du musst nicht die location, sondern das src-Attribut des iframes ansprechen:
HTML: 
document.getElementById('main').src=this.value

Gruß
.
 
Datic, ich danke dir, es hat geklappt und ich bin zufrieden.

Ich muss erst noch viel Grundlagen in HTML und CSS lernen bevor ich mich an Javascript wagen kann. Daher bin ich froh wenn ich mich bei solchen kleinen Sachen schnell an euch hier wenden kann.:)

gruß
feh
 
Hallo,

ich habe leider ein Problem festgestellt bei meinem option select dropdown menü. Es funktioniert irgendwie nur im IE und in den anderen Brwosern wie Netscape, Mozilla und Opera überhaupt nicht.

Ich weis nicht, aber kann mal bitte jemand schauen wie das sein kann, thanks.

Code:
HTML: 
<!-- TEMPLATE.v2 | SPIRULINA.HTML : 30.11.04 | VALIDATION : 10.02.05 -->
<!-- BROWSERCHECK : IE5.5 - MOZ1.6 - NN7.0 - OPERA7.23 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
<html lang="de">
<head>
<title>Herzlich willkommen</title>
 <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
 <link rel="STYLESHEET" href="styles.css" type="text/css">
 <style type="text/css">
<!--
html
{
height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0; background-color:#fff; background:url(images/hinter123.jpg) #fff; background-position:-18px 0; font-size:76%; font-family:georgia, palatino linotype, times new roman, serif;
}
body
{
height:100%; max-height:100%; overflow:hidden; padding:0; margin:0; border:0;
}
-->
</style>
</head>
<body>
 
<div id="head2">
<div align="center"><div style="width:800px" align="center">
<div id="rahmen">
<div id="zuruck"><a href="index.html">Zurück zur Startseite</a></div>

<div id="sub">
<form>
<select class="combobox" name="select" onChange="document.getElementById('main').src=this.value">
<option value="#">Men&uuml;</option>
<option value="http://www.123.de">waren</option>
<option value=http://www.rei.de>en</option>
<option value="http://www.atpp.net">Angebote</option>
<option value=http://www.atpp.net/>weg</option>
</select>
</form>
</div>

<div id="datum"><script language="JavaScript" type="text/javascript">
<!--
var Datum = new (Date);
var Tag = Datum.getDate();
var Wochentag = Datum.getDay();
var Monat = Datum.getMonth();
var Jahr = Datum.getYear();
var Tagname = new Array("So","Mo","Di","Mi","Do","Fr","Sa");
var Monatname = new Array("Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember");
var Stunde = Datum.getHours();
var Minute = Datum.getMinutes();
if(Minute<10)
{
		 Minute = "0" + Minute;
}
if(Stunde<10)
{
		 Stunde = "0" + Stunde;
}
document.write(Tagname[Wochentag]+", "+Tag+". "+Monatname[Monat]+" "+Jahr+" - "+Stunde+":"+Minute);
//-->
</script>
</div>
<br style="clear:both;">
</div>
</div>
</div>
</div><!--head-->
 
<div id="comtent2">
<iframe scrolling="yes" ALLOWTRANSPARENCY="true" marginheight="10" marginwidth="10" frameborder="0"  name="main" height="100%" width="100%" src="http://www.123.de">
Ihr Browser kann leider keine eingebetteten Frames anzeigen:
</iframe>
  </div>
</body>
</html>
 
Oh man, Schande über mein Haupt und Ehre wem Ehre gpürht.

Da habe ich doch die ganze Zeit das Attribut name als id angenommen. Ich glaub manchmal denke ich alles gehts wohl von selbst.

Ich hab da noch eine Sache die mich interrisiert, vielleicht kannst du ja auch mal drüber schauen, in dem Javascript Kalenderblatt sind die Rahmen so häßlich in Standard grau, mir würde es ja genügen wenn ich wüste wie ich den äußersten Rahmen wenigstens in eine andere Farbe bekomme :) :

Code:
HTML: 
<script language="JavaScript" type="text/javascript">
<!--
var d = new Date();
var dm = d.getMonth() + 1;
var dj = d.getYear();
if(dj < 2000) dj+=1900;
Kalender(dm,dj);
function Kalender(Monat,Jahr)
{
Monatsname = new Array
("Januar","Februar","M&auml;rz","April","Mai","Juni","Juli",
"August","September","Oktober","November","Dezember");
Tag = new Array ("Mo","Di","Mi","Do","Fr","Sa","So");
var KSchrArt = "Verdana,Arial"; /* Schriftart Kalenderkopf */
var KSchrGroesse = 2;			/* Schriftgroesse 1-7 Kalenderkopf */
var KSchrFarbe = "#FFFF00";	 /* Schriftfarbe Kalenderkopf */
var Khgrund = "#000066";		 /* Hintergrundfarbe Kalenderkopf */
var TSchrArt = "Verdana,Arial"; /* Schriftart Tagesanzeige */
var TSchrGroesse = 1;			/* Schriftgroesse 1-7 Tagesanzeige */
var TSchrFarbe = "#000000";	 /* Schriftfarbe Tagesanzeige */
var Thgrund = "#D0F0F0";		 /* Hintergrundfarbe Tagesanzeige */
var SoFarbe = "#E00000";		 /* Schriftfarbe f. Sonntage */
var Ahgrund = "#FFFF00";		 /* Hintergrundfarbe f. heutigen Tag */
var jetzt = new Date();
var DieserMonat = jetzt.getMonth() + 1;
var DiesesJahr = jetzt.getYear();
if(DiesesJahr < 2000) DiesesJahr+=1900;
var DieserTag = jetzt.getDate();
var Zeit = new Date(Jahr,Monat-1,1);
var Start = Zeit.getDay();
if(Start > 0) Start--;
else Start = 6;
var Stop = 31;
if(Monat==4 ||Monat==6 || Monat==9 || Monat==11 ) --Stop;
if(Monat==2)
{
AnzTage=-3;
if(Jahr%4==0) Stop++;
if(Jahr%100==0) Stop--;
if(Jahr%400==0) Stop++;
}
document.write("<table border=3 cellpadding=1 cellspacing=1>");
var Monatskopf = Monatsname[Monat-1] + " " + Jahr;
SchreibeKopf(Monatskopf,Khgrund,KSchrFarbe,KSchrGroesse,KSchrArt);
var Tageszahl = 1;
for(i=0;i<=5;i++)
{
document.write("<tr>");
for(j=0;j<=5;j++)
{
	if((i==0)&&(j < Start))
	 SchreibeZelle(" ",Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
	else
	 {
	 if(Tageszahl > Stop)
		SchreibeZelle(" ",Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
	 else
	 {
		if((Jahr==DiesesJahr)&&(Monat==DieserMonat)&&(Tageszahl==DieserTag))
		 SchreibeZelle(Tageszahl,Ahgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
		else
		 SchreibeZelle(Tageszahl,Thgrund,TSchrFarbe,TSchrGroesse,TSchrArt);
		Tageszahl++;
	 }
	 }
	 }
	if(Tageszahl > Stop)
	 SchreibeZelle(" ",Thgrund,SoFarbe,TSchrGroesse,TSchrArt);
	else
	 {
	 if((Jahr==DiesesJahr)&&(Monat==DieserMonat)&&(Tageszahl==DieserTag))
		SchreibeZelle(Tageszahl,Ahgrund,SoFarbe,TSchrGroesse,TSchrArt);
	 else
		SchreibeZelle(Tageszahl,Thgrund,SoFarbe,TSchrGroesse,TSchrArt);
	 Tageszahl++;
	 }
	document.write("</tr>");
}
document.write("</table>");
}
function SchreibeKopf(Monatstitel,HgFarbe,SchrFarbe,SchrGroesse,SchrArt)
{
document.write("<tr>");
document.write("<td align=center colspan=7 valign=middle bgcolor="+HgFarbe+">");
document.write('<font size='+SchrGroesse+' color='+SchrFarbe+' face="'+SchrArt+'"><b>');
document.write(Monatstitel);
document.write("</b></font></td></tr>");
document.write("<tr>");
for(i=0;i<=6;i++)
SchreibeZelle(Tag[i],HgFarbe,SchrFarbe,SchrGroesse,SchrArt);
document.write("</tr>");
}
function SchreibeZelle(Inhalt,HgFarbe,SchrFarbe,SchrGroesse,SchrArt)
{
document.write("<td align=center valign=middle bgcolor="+HgFarbe+">");
document.write('<font size='+SchrGroesse+' color='+SchrFarbe+' face="'+SchrArt+'"><b>');
document.write(Inhalt);
document.write("</b></font></td>");
}
// -->
</script>

gruß
feh
:)
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück