oncklick viele funktionen,...

JesusFreak777

Erfahrenes Mitglied
hallo

ich hab folgendes Problem:

ich hab hier ne Tabelle
HTML:
<table
 name="valuea"
 id="valuea"
 width="400" height="115"
 background="img/buttonnkl.png">
 <tr><td>Antwort</td></tr>
</table>

jetzt möchte ich folgendes machen.
wenn ich mit der Maus drüber fahre, will ich einen anderen Hindergrund,
onmouseover="this.background='img/buttonokl.png'" (blau)
das bekomm ich hin,
wenn ich wieder rausfahre will ich wieder den alten Hindergrund,
onmouseout="this.background='img/buttonnkl.png'" (orange)
auch kein Problem.
aber wenn ich jetzt klicke möchte ich viele sachen haben,

1. es soll ne meldung kommen "sind sie sich sicher?" mit den button "fortfahren" und "abbrechen"
2. wenn ich draufklicke soll sich der hindergrund zu einen dritten bild (grün) ändern, das bild bleibt wenn ich auf abbrechen klicke, erst wenn ich wieder drüber fahre kommt das orangene (onmouseover) bild und wenn ich wieder rausfahre onmouseout wieder das (grüne) sozusagen ändere ich den style (muss ich da ne variable setzen und wenn ja wie?)
3. wenn ich auf fortfahren klicke möchte ich gerne eine weiterleitung haben zu einer anderen seite,...

ist das realisierbar?

Danke
 
Jo, das ist gut möglich :)

1. Dafür gibt es die JS-Methode confirm()
2. Das mit dem Hintergrund würde ich generell durch Vergabe von Klassennamen regeln. Beim Klick änderst du am besten den Klassennamen, dann kannst du beim mouseout diesen prüfen und festestellen, ob dort schon mal geklickt wurde und im Fall der Fälle das grüne Hintergrundbild zuweisen.

3. Das geht bspw. durch durch Änderung der location-Eigenschaft des Fensters

zu 2+3:
Auf welchen Button bei confirm() gedrückt wurde sagt dir der Rückgabewert von confirm()...beim "Abbruch" ist er false, andernfalls true
Code:
<script type="text/javascript">
<!--
if(confirm('Muss das wirklich sein?'))
  {
    alert('Na gut, wenn du es so willst');
  }
else
  {
    alert('gottseidank hast du abgebrochen');
  }
//-->
</script>
zu 4: (hast du zwar noch nicht gefragt, kommt aber bestimmt :) )
Den Text der 2 Buttons kannst du nicht beeinflussen, dieser ist browserabhängig .
 
Pseudocode:

HTML:
Code:
<table id="tbl" onclick="javascript: clickHandler ();" onmouseover="javascript: mouseOver ();" onmouseout="javascript: mouseOut();">
...

JavaScript:
Code:
var outImg = "blau.jpg";
var overImg = "rot.jpg";

function mouseOut ()
{
	document.getElementById("tbl").background = outImg;
}

function mouseOver ()
{
	document.getElementById("tbl").background = overImg;
}

function clickHandler ()
{
	overImg = "gruen.jpg";
	mouseOver ();

	if (window.confirm ("Sind Sie sich sicher?"))
		location.href = "newUrl.htm";
	else
	
}

Musst du natürlich noch auf deine Gegebenheiten adaptieren - habe mir nicht sooooo genau durchgelesen, wie du's letzten Endes haben willst (grün bei over oder out?).
 
Zurück