Javascript-Schaltfläche klicken + offenbaren

Question

Ich habe einen großen roten Knopf, und ich versuche Javascript zu verwenden, um den folgenden auszuführen: -

1. onMouseDown Bild ändern, so dass die Taste gedrückt aussieht
2. onMouseUp zum Ausgangsbild zurückzukehren und eine versteckte div
offenbare

kann ich die OnMouse Down and onMouseUp bekommen Bild ändert Teil zu arbeiten.

Ich kann auch die versteckte div erhalten, indem zu offenbaren OnClick mit

Das Problem ist, kann ich nicht bekommen sie alle zusammen zu arbeiten.

Wie kann ich das tun?

BTW, ich bin sicher, dass seine Hand, aber ich bin ziemlich neu in Javascript, so dass ich schätze Ihre Hilfe

Answer 1

Sie können Semikolons verwenden, um mehr Skript-Anweisungen in einem Fall zu trennen:

<img src="..." alt="..."
  onmousedown="depressed();"
  onmouseup="undepressed(); revealDiv();" />

Auch ich glaube, die meisten Browser das Onclick-Ereignis unterstützen:

<img src="..." alt="..."
  onmousedown="depressed();"
  onmouseup="undepressed();"
  onclick="revealDiv();" />

Da Sie gesagt haben Sie bereits separat jede der drei Teile herausgefunden, schrieb ich gerade Funktion aufruft, dass Sie mit Ihrem eigenen Code für jeden Schritt ersetzen können.

Answer 2

Ohne Code zu sehen, ist es schwer zu sagen, aber ich vermute, ein fehlendes ‚return true;‘ Erklärung am Ende entweder den Onclick oder onmouseup Event-Handler.

Answer 3

Es ist nie Ereignisse Elemente empfohlen Notation der direkt in ein HTML-Element-Tag mit dem Attribut zu befestigen.

Es ist eine viel besser Praxis die Ansicht (wobei die gerenderte HTML) von der Steuerung (die Aktionen geschehen) trennen

Der beste Weg, ein Ereignis ist wie so anbringt:

<img id="abut" />

<script>
var thebutton = document.getElementById('abut'); //Retrieve the button from the page 
thebutton.onmousedown = depressed; //depressed is a function that you declare earlier on...here, you are just passing a reference to it
thebutton.onmouseup = function () {
    undepressed();
    revealDiv(); //Invoke the two functions when the 'onmouseup' is triggered'
};
</script>