Ashura: Formularschaltfläche nach dem drücken ausblenden

Beitrag lesen

Hallo olivers_free.

Lies *bitte* mein verlinktes Posting.

vielleicht liegt es einfach daran, dass ich keine Ahnung von Javascript habe, aber mir ist nicht klar, wo ich deinen Code-Schnipsel unterbringen soll...

Gut, du hast ihn zumindest schon einmal bemerkt.

Vielleicht könntest du mir das genauer erklären?

Eine Möglichkeit wäre, meinen Schnipsel in einem Script–Block im Head–Bereich des jeweiligen Dokumentes unterzubringen. Hierbei musst du jedoch beachten, dass du den onclick–Event keinem Element zuordnen kannst, welches noch nicht existiert. Zum Zeitpunkt der Ausführung von JS im Head–Bereich existiert der jeweilige Formularbutton aber gewiss noch nicht. Also müssen wir mit dem http://de.selfhtml.org/javascript/sprache/eventhandler.htm#onload@title=onload–Event des window–Objektes arbeiten, welcher aktiviert wird, wenn das Dokument vollständig fertig geladen wurde:

<head>  
  <script type="text/javascript">  
  
    [code lang=javascript]window.onload = function() {  
  
      // Tue etwas  
  
    };

</script>
<head>[/code]

Hier weisen wir dem onload–Event eine anonyme Funktion zu. Alternativ könnten wir auch die Referenz auf eine bestehende Funktion zuweisen, aber das soll uns hier nicht interessieren.

Weiters benötigen wir natürlich einen Zugriff auf den jeweiligen Formularbutton. Damit du hierfür keine Änderungen im HTML durchführen musst, verwenden wir das indexbasierte http://de.selfhtml.org/javascript/objekte/document.htm#get_elements_by_tag_name@title=getElementsByTagName. Alternativ kannst du auch die http://de.selfhtml.org/javascript/objekte/forms.htm@title=forms.http://de.selfhtml.org/javascript/objekte/elements.htm@title=elements–Collection verwenden.

Und nun kommt mein Codeschnipsel ins Spiel. Dieser verwendet ein und die selbe Vorgehensweise, indem er dem onclick–Event des Buttons eine anonyme Funktion zuweist, welche die letztendlich beim Klick auf den Button auszuführende Aktion durchführt:

document.getElementsByTagName('input')[18].onclick = function() {  
  this.disabled = true;  
}

Da der Index in Arrays und Collections immer bei 0 beginnt, greifen wir hier also auf das neunzehnte input–Element im Dokument zu. Diesen Wert musst du natürlich deinen Gegebenheiten gemäß anpassen. In dieser anonymen Funktion befinden wir uns nun im Kontext des Buttons, weshalb wir auch einfach mit http://de.selfhtml.org/javascript/sprache/objekte.htm#this@title=this darauf Bezug nehmen können. Und da Buttons über besagte disabled–Eigenschaft verfügen, können wir sie hier auch direkt manipulieren. Das gesamte Konstrukt bewirkt also eine Deaktivierung des Buttons, wenn der onclick–Event aktiv wird, lies: wenn man den Button per Maus oder Tastatur aktiviert.

Zum Schluss kombinieren wir nun also alles miteinander:

<head>  
  <script type="text/javascript">  
  
    [code lang=javascript]window.onload = function() { // Beim Fertigladen …  
  
      // … weisen wir dem onclick–Event des Buttons …  
      document.getElementsByTagName('input')[18].onclick = function() {  
        this.disabled = true; // …  diese auszuführende Aktion zu.  
  
    };

</script>
<head>[/code]

Wenn noch immer Fragen bestehen, stelle sie bitte.

Einen schönen Mittwoch noch.

Gruß, Ashura

--
sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
„It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
[HTML Design Constraints: Logical Markup]