wie kann ich in javaScript eine Funktion mit einem Tastendruck aufrufen?

Hi Leute,

ich programmiere einen Taschenrechner und möchte dafür eine funktion über die Tastatur aufrufen können. Also wenn ich zum Beispiel eine 2 drück, soll die function calculate(2); aufgerufen weden. Im internet habe ich viele Ergebnisse gefunden, die mich verwirrt haben.

Vielen Dank im Voraus😉

1 Antwort

Vom Fragesteller als hilfreich ausgezeichnet

Natsujoestar

10.12.2022, 23:39

Ja, kannst du. Hier eine Lösung:

//Erstelle ein Ereignis beim Drücken einer Taste document.addEventListener('keydown',function(e){ //Überprüfe den Keycode, den du gedrückt hast if(e.keyCode == 49){ calculate(1); } else if(e.keyCode == 50){ calculate(2); } });

//Füge die calculate() Funktion hinzu function calculate(num){ console.log('Die Funktion calculate() wurde mit dem Parameter ' + num + ' aufgerufen.'); }

HI, ich programmiere gerade einen Taschenrechner in HTML/CSS/JavaScript und möchte den Abstand zwischen den Elementen entfernen. Margin, Padding und Border sind bereits auf 0 gestellt. Der Abstand ist auch nur horizontal zwischen den Elementen. Vielen Dank im Voraus :-)

...zur Frage

JavaScript warten, bis sich Variable ändern?

Ich habe ein Formular mit einem Submit-Button.

<button onClick={() => submitHandler("fromSubmitButton")}>Submit</button>

Die submitHandler Funktion sendet über einen Websocket eine Nachricht an den Server, ohne eine direkte Antwort zu bekommen, wie es mit async/await funktionieren würde:

socket.emit('email-submit', value)

Nach einiger Zeit kommt vom Server bzw. Websocket eine Nachricht:

        socket.on('badEmailORphone', function(msg) {
            setBadEmailORphone(msg)
        });

In der Zeit zwischen dem Klick auf Submit und setBadEmailORphone gesetzt wird, möchte ich einen Ladescreen einblenden.

Rein logisch müsste ich den Ladescreen ab Klick auf den Submit-Button bis setBadEmailORphone setzen, aber wie kann ich in JavaScript x Sache machen, bis sich eine Variable ändert?

Meine erste Theorie war:

Submit onClick:

while(!setBadEmailOrphone) setLoading(true) //Mit etwas Delay zwischen Durchläufen

...zur Frage

C-Knopf im Taschenrechner programmieren?

Ich habe vor, einen Taschenrechner in HTML und JS zu coden, aber ich weiß nicht, wie ich diesen Knopf, der alles löscht in eine Funktion packen kann.

So habe ich es bisher versucht, aber es funktioniert nicht:

function deleteAll() {
  let container = document.getElementById("resultarea");
  let remove = clrs(container.innerHTML);
  container.innerHTML = remove;
}

...zur Frage

PHP Funktion aufrufen?

Ich habe eine PHP Funktion in einer anderen ausgelagerten Datei und möchte diese jetzt in einer JavaScript Funktion aufrufen siehe Quellcode:

was mache ich falsch und bitte mit Lösungsvorschlägen


function PersonXSenden()
{
   InhaltPersonX = document.getElementById("X").value;
   console.log(InhaltPersonX);
   document.cookie = "XCookie = " + InhaltPersonX;
   test3();

   <?php
       include "Chat2.php";
       test();
   ?>
}

...zur Frage

Javascript Button erstellen?

Hallo,

ich habe einen Button in HTML erstellt und möchte, dass dieser per Click, die Farbe eine Textelements in Schwarz ändert. Den Button habe ich erstellt, komme aber bei der Funktion nicht weiter, kann jemand helfen? Danke im Voraus.

<button type="button" onclick=document.getElementById('Liste').style.color = 'black'">Drück mich!</button>

Aktueller Stand

...zur Frage

JavaScript/jQuery! Wie einen Loop einbinden?

Auch hier bin ich absoluter Newby!

Ich habe eine nette kleine Funktion:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code2').html() }).animate({ countNum: 5360 }, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code2').html(Math.floor(this.countNum));

complete: function () {

$('.code2').html(this.countNum + "+");

//alert('finished');

}

});

--------------------------------------------------------------------------------------------------------------

Das funktioniert - alles supi - nun möchte ich, dass die Animation nach einem kleinen Zeitintervall erneut startet. Habe dazu über Google 'setInterval' gefunden und einen Code. Leider fehlt mir noch das Verständnis was ich wo einfügen muss.

Hier der Code von Google:

Edit: Ist der Code vielleicht falsch, javascript vs jquery???

function meineFunktion() { 
    // ... 
} 

setInterval(function() { 
    // alle 3 Sekunden ausführen 
    meineFunktion(); 
}, 3000);

Habe das so in meine Scriptdatei eingebunden:

--------------------------------------------------------------------------------------------------------------

$({ countNum: $('.code').html() }).animate({ countNum: 1295365}, {

duration: 10000,

easing: 'linear',

step: function () {

$('.code').html(Math.floor(this.countNum));

setInterval(function() {

// alle 3 Sekunden ausführen

meineFunktion();

}, 3000);

complete: function () {

$('.code').html(this.countNum + "+");

//alert('finished');

}

--------------------------------------------------------------------------------------------------------------

Ich nehme an mindestestens "meineFunktion()" ist nur ein Platzhalter, aber ich bin nicht sicher, was da vom Code rein soll.

Stört das complete eigentlich die Wiederholung oder zeigt das nur an, was passiert, wenn es fertig hochgezählt hat?

Freue mich wie immer über Antworten! :)

Aber auch über Links z.B. mit einer leicht verständlichen Übersicht der Anatomie eines Jquery Codes, damit ich zukünftig besser allgemeine Beispiele an meine anpassen kann.

Bonusfrage:

Ich würde ganz gerne zu der Zahl noch eine einfache sich drehende Grafik (Kreis, Pfeil oä) hinzufügen. Hat da jemand zufällig nen leicht verständlichen Link oä dazu?

...zur Frage

Was mache ich falsch in JavaScript?

Ich will die Rotation einen 2D-Versors berechnen und dafür, will ich erstmal den Realteil ausrechnen.

Mein Problem ist: Es rechnet einfach nicht.

Was mache ich falsch?:

window.addEventListener('keydown', (event) => {
    if (event.keycode === '13') {
        return
    };
    function calculate (calculate)
}
)


function calculate (calculate) {
    let z_rotaited = document.getElementById('RotatedComplexversorZ');
    let Rez = document.getElementById('Re(z)');
    let Imz = document.getElementById('Im(z)');
    let Rotationangle = document.getElementById('Rotationangleindegree');
    let result = Math.sqrt(Rez ** 2 + Imz ** 2) * Math.cos(Rotationangle + Math.atan2(Rez, Imz) * 180 / Math.PI);
    z_rotaited = result;
}
function calcAngleDegrees(containerRez, containerImz) {
    return Math.atan2(containerRez, containerImz) * 180 / Math.PI;
  }

(Wenn ich Enter drücke, soll die eine Funktion laufen, welche das rotierte z ausrechnet.
Die Funktion (mathematich gesehen) lautet:

z_{rotiert} = sqrt(Re(z)² + Im(z)²) * (phi + cos(arctan2(Re(z), Im(z))) i * sin(phi + arctan2(Re(z), Im(z))))
z = 2D-Versor
phi = der dazu adierte Winkel

Die Seite sieht so aus:

...zur Frage

JavaScript interval mehrmals aufrufen?

Hallo, ich habe das Problem, dass ich ein Interval mehrmals aufrufen möchte.

Jedoch kann ich immer nur eines abbrechen.

Ich hätte das Abbrechen so versucht:

clearInterval(interval + thema);

Funktioniert leider nicht.

                var zahl = 0;
                var intervalphp = setInterval(erhoeheZahl, 100, 90, 'php');
                var intervalcss = setInterval(erhoeheZahl, 100, 100, 'css');


                function erhoeheZahl(max, kreis, thema) {
                    zahl++;
                    console.log(zahl);
                    document.getElementById(kreis).innerHTML = zahl;
                    document.getElementById(kreis + 'kreis').style.background = `conic-gradient(#712e1e ${zahl * 3.6}deg, #ffd5af 0deg)`;


                    if (zahl >= max) {
                        clearInterval(interval + thema);
                    }
                }

Danke im voraus!

...zur Frage

Javascript Seitenübergreifend?

Hallo,

ich möchte in einen Html Code einen Javascript Code für Lesezeichen einfügen. Also ich habe eine Seite mit vielen Texten (Seite x), zu jedem Text gibt es einen Button, der das jeweilige Lesezeichen hinzufügen soll. Wenn dieser Knopf gedrückt wird, dann soll ein derzeit unsichtbarer Container (display: none;) auf display:flex; bzw. Sichtbar gestellt werden (in Seite y).

Der Code der diese Funktion ausführen soll wäre derzeit:

function textfield1() {

var x = document.getElementById("th1");

if (x.style.display === "none") {

x.style.display = "block";

} else {

x.style.display = "none";

}

Dieser Code wird natürlich nur auf Seite x ausgeführt
kann mir jemand helfen, dass dieser Container dann auf Seite y gezeigt wird?

...zur Frage

JavaScript EventListener funktioniert nicht richtig?

Mein JS-Code:

'use strict'

let lines = document.getElementsByClassName("src-line");
let activeLine = -1;

for (let i1 = 0, i2 = lines.length; i1 < i2; i1++) {
  lines[i1].addEventListener("mouseover", function(){
    lines[i1].style.cursor = "text";
  });
  lines[i1].addEventListener("click", function(){
    activeLine = i1;
    console.log(activeLine);
  });
}
addEventListener("keydown", keypressed(e));

function keypressed(e) {
  if (activeLine != -1) {
    if (e.key == "Backspace") {
      console.log("Backspace");
      ediText[activeLine] = ediText[activeLine].substring(0, ediText[activeLine].length - 1);
    }
    else if (e.key == "Tab") {
      ediText[activeLine] += "&nbsp;&nbsp;&nbsp;&nbsp;";
    }
    else if (e.key == "Shift") {
      return;
    }
    else if (e.key == "Space") {
      ediText[activeLine] += "&nbsp;";
    }
    else {
      ediText[activeLine] += e.key;
    }

    console.log(e.key)
    charCompiler(ediText);
  }

  return 0;
};

Wenn ich nun auf ein Element mit der Klasse src-line klicke, wird in der Konsole immer der Listenindex angezeigt. Ich habe momentan zwei, also zeigt es immer 0 oder 1 an.

Wenn ich jetzt allerdings anfange, Buchstaben einzugeben, wird das zuletzt angeklickte Element verändert. Jedoch kann ich jetzt nicht mehr das Element wechseln, denn klicke ich jetzt auf das andere Element, wird das click-Event nicht mehr aufgerufen. D.h. activeLine wird nicht mehr geändert. Ich habe keinen Plan, warum.

Ist evtl. am Code was falsch, weil ich habe keine Ahnung warum das click-Event nach dem keydown einfach ignoriert wird, obwohl es davor ja noch ging. Btw wird auch in der Konsole beim Klicken danach nichts mehr angezeigt.

...zur Frage

Addition in Javascript funktioniert nicht?

Ich versuche es zu erreichen, dass wenn ein HTML-Button gedrückt wird eine Javascript-Funktion aufgerufen wird. Diese soll die Variable Anzahl dann um 1 erhöhen. Beim 1. Mal funktioniert das auch und der voher definierte Wert (z.B. 7) erhöt sich um einen. Dann bleibt er aber bei 8.

var Anzahl = parseFloat(7);



function gedrueckt(Anzahl) {
    Anzahl += 1;
    console.log(Anzahl);
}

Wisst ihr woran das liegen könnte?

Ich hoffe auf antworten

Bohne47

...zur Frage

Javascript Funktion *auch* bei onload ausführen?

Hallo liebe Community,

wenn ich schreibe:

window.onload = function(){
  element.onclick = element.onchange = function(){ alert("Funktion aufgerufen"); }
  /* Anderer Code */
}

Dann wird die Funktion sowohl bei onlick als auch bei onchange ausgeführt.

Ich möchte, dass sie beim Aufrufen der Elternfunktion und bei onchange ausgeführt wird, also folgendes, ohne die Funktion zweimal zu schreiben:

 window.onload = function(){
  alert("Funktion aufgerufen");
  element.onchange = function(){ alert("Funktion aufgerufen"); }
  /* Anderer Code */
}

Wie kann ich das umsetzen?

...zur Frage

Javascript funktion um gewisse Uhrzeit, setinterval Ressourcen Belastung?

Hallo zusammen

Ich bräuchte eine function, welche immer um die gleiche Uhrzeit, jeden Tags ausgeführt wird. Jeden Tag um 23:59

Nun habe ich eine setInterval function welche jede sekunde ausgeführt wird. wenn die aktuelle uhrzeit 23:59:0 betrifft, wird die eigentliche function ausgeführt.

Meine Frage: Ist das sehr ressourcen verbrauchend, da jede sekunde abgefragt wird?

function tick() {
  //get the mins of the current time
  var mins = new Date().getMinutes();
  var sec = new Date().getSeconds();
  var hours = new Date().getHours();
  var time_stamp = "23:59:0";
  var time_stamp = "15:20:0";
  var current_time = hours + ":" + mins + ":" + sec;
  
  if (current_time == time_stamp) {
    alert('Do stuff');
  }
  console.log('Tick ' + hours + ":" + mins + ":" + sec);
}


setInterval(tick, 1000);

...zur Frage

wie kann man in JavaScript eine Funktion erstellen, die eine zufällige Zahl generiert?

Hi Leute!

Wie kann ich ich JavaScript eine Funktion erstellen, die jede Zahl zufällig von 1 bis 16 auswählt, jedoch darf keine mehrmals vorkommen.

Vielen dank im voraus🙂

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen