Zwei funktionen auf ein button packen?
Wie kann ich zwei funktionen auf einen Button packen? Also ich will das bei jedem click auf meinen button
1. immer plus 1 addiert wird: onclick="pluszahl()"
2. das ein Sound abgespielt wird: onclick="play()"
Leider konnte ich nur den counter machen und frage mich jetzt wie ich den sound auch aktivieren kann
HTML:
<span class="center">Bam?</span>
<div onclick="custom()" class="btn-container">
<button onclick="pluszahl()"; twoclick="play()" class="button1">
Bam
</button>
</div>
<div id="resultArea">0</div>
JavaScript:
function play() {
var audio = new Audio('bam.mp3');
audio.play();
}
function pluszahl() {
document.getElementById("resultArea").innerHTML = parseInt(document.getElementById("resultArea").innerHTML)+1;
}
5 Antworten
Du rufst die play-Funktion einfach in der pluszahl-Funktion auf.
Im Übrigen würde ich EventListener anstelle von den Event Attributen nutzen.
Eleganter wäre es ebenfalls noch, wenn du drei Funktionen hast: Eine für die Audio, eine für die Pluszahl und schlussendlich noch eine, welche beim Event aufgerufen wird und die anderen zwei aufruft.
Ja hab die funktionen vereinig wie es ein user hier auch empfohlen hat. Vielen Dank auch für die Tipps, werde versuchen das hinzukriegen
Da steht ein Semikolon zwischen den Attributen von <button>.
Google sagt mir nichts zum Attribut namens twocklick.
Vermutlich meinst du
<button onclick="pluszahl(); play()" class="button1">
// Elemente als Konstante speichern
const button1 = document.querySelector('.button1');
const resArea = document.querySelector('#resultArea');
// Beliebige Funktionen erstellen
function play() { // ... };
function plus() { // ... };
// Beliebige Funktionen gruppieren
function btnPlayPlus() {
play();
plus();
};
// Funktion(en) mit einem Click-Event zuweisen
button1.addEventListener('click', btnPlayPlus);
LG medmonk
Lass das onclick weg und nutze richtige Events, so wie es sich gehört. Dann kannst du so viel aufrufen, wie du willst
Welche Events sollte ich dann nutzen? Habe halt erst jetzt mit Js angefangen
Google mal nach click Event.
Da gibt es viele Infos zu.
https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event
const button1 = document.querySelector('.button1');
const resArea = document.querySelector('#resultArea');
// Beliebige Funktionen erstellen
function play() { // ... };
function plus() { // ... };
// Beliebige Funktionen gruppieren
function btnPlayPlus() {
play();
plus();
};
// Funktion(en) mit einem Click-Event zuweisen
button1.addEventListener('click', btnPlayPlus);
Dankeee hat funktioniert. Und ja hab twoclick nur ausprobiert und vergessen zu löschen xD