OnClick bei einem Bild?

[Extremefall]

Hallo,
wie kann man ein OnClick Event für ein Bild festlegen? Meine Idee:

<img 

src="../images/right.png" onclick="this.form.Ausgabe.value = this.form.Ausgabe.value

+bold">

funktioniert leider nicht.

 

[threadi]

Kann auch nicht funktionieren, weil "this" kein Formular enthält.

Das hier muss funktionieren:

<img src="bild.jpg" onclick="alert('ausgabetext im fenster');return false;">

Du musst folglich nur noch das auszuführende JavaScript richtig formulieren.

 

[Gelöschtes Mitglied 3007]

Warum eigentlich so kompliziert? Seinen Code mitten in die Datei zu schreiben ist nicht unbedingt die feine Englische...

Ich würde eine der folgenden Lösungen wählen:

1. Den IMG Tag mit einer ID ausstatten und das onclick Event als Funktion setzen. document.getElementById('image_id').onclick = function() { /* hier deinen code ausführen */ };
2. Den IMG Tag mittels eines gängigen Frameworks und einem Selector auswählen und dann onclick setzen wie in 1. (jQuery Bsp.: $('.someClass img').click(function() { /* hier deinen code ausführen */ }))
3. Das komplette IMG Tag manuell erstellen. (Beschreibung folgt)

// Element erstellen
var img = document.createElement('img');

// Bild Pfad setzen
img.src = '/bild/pfad.endung';

// onload Event belegen
img.onload = function() {
    /* hier deinen code ausführen */
};

// IMG Tag an ein anderes DOM Element anhängen (hier wird der IMG Tag in den BODY Tag eingefügt)
document.getElementsByTagName('body')[0].appendChild(img);

Hoffe ich konnte hilfreiche Informationen liefern.

lg

 

[Extremefall]

Leider bin ich nicht so der JavaScript Experte. Ich habe jetzt eine Funktion erstellt:

<script type="text/javascript">
function bold() { 
var bold = "[BOLD]";
this.form.Ausgabe.value = this.form.Ausgabe.value+bold;
}
</script>

Jedoch passiert beim Aufruf nichts:

<img src="../images/right.png" onclick="bold()">

Was mache ich wohl falsch? Muss ich anders auf das Textfeld Ausgabe zugreifen?

So funktioniert es:
<input type="button" value="Test" onClick="this.form.Ausgabe.value = this.form.Ausgabe.value+bold">

Leider nicht so mit Bildern.

 

[threadi]

Auch bei deiner Überarbeitung ist das Problem, dass es "this" nicht gibt.

Da Du direkt ein Formularfeld bearbeiten willst, genügt es wenn Du diesem eine eindeutige (!) ID gibst und verwende dann folgende Zeile in deiner Funktion statt dieser mit "this" am Anfang:

document.getElementById("HierDieObjektIDRein").value = document.getElementById("HierDieObjektIDRein").value+bold;

 

[struppi]

Jedoch passiert beim Aufruf nichts:

Doch. Du bekommst eine Fehlermeldung. Wo du diese findest hängt von deinem Browser ab, suche mal nach der Fehlerkonsole.

 

[Gelöschtes Mitglied 3007]

Eindeutige IDs zu vergeben ist eigentlich keine Option. Man sollte sich frühst möglich damit auseinander setzen ohne IDs zu arbeiten da die das Leben später nur erschweren.

 

[threadi]

Natürlich gibt es auch noch andere Wege, ich habe oben nur einen Weg gezeigt der es einem Einsteiger ermöglicht überhaupt erstmal ein Erfolgserlebnis zu haben und darauf aufbauend dann natürlich auch mal andere Wege zu beschreiten - ohne IDs :]