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:

Bild zum Beitrag

20.09.2022, 21:19

Der Body sieht so aus:

<body>
    <h1>Rotation in R2</h1>
    <form id = "ComplexversorImput">
        <label for = "ComplexversorZ">Complex Number z: </label><br><br>
        <label for = "Re(z)">Re(z): </label>
        <input type ="text" id = "Re(z)" name = "Re(z)"><br><br>
        <label for = "Im(z)">Im(z): </label>
        <input type = "text" id="Im(z)" name = "Im(z)">
        <label for = "Im(z)">i</label><br><br>
    </form>
    <form id = "Rotationangle">
        <label for = "Rotationangleφ">Rotationangle φ: </label><br><br>
        <label for = "Rotationangleindegree">Rotationangle: </label>
        <input type = "text" id = "Rotationangleindegree" name = "Rotationangleindegree">
        <label for = "Rotationangleindegree"> °</label><br><br>
        <label for = "Rotationangle in rad">Rotationangle: </label>
        <input type = "text" id = "Rotationangleinrad" name = "Rotationangleinrad">
        <label for = "Rotationangle in rad"> rad</label><br><br>
    </form>
    <div id = "RotatedComplexversor">
    Rotaited Complex Number z':</div>
    <div id = "RotatedComplexversorZ">
    </div>
</body>

1 Antwort

Vom Fragesteller als hilfreich ausgezeichnet

regex9

Von gutefrage auf Grund seines Wissens auf einem Fachgebiet ausgezeichneter Nutzer

programmieren, JavaScript, Programmieren & Softwareentwicklung

20.09.2022, 22:20

1) Für einen Funktionsaufruf wird nur der Name der Funktion sowie die Argumentenliste angegeben. Bei dir wäre das im Event Handler also:

calculate();

Die Funktion selbst an sich noch einmal zu übergeben, wie du es da machst, ist ohne Sinn. An sich braucht deine Funktionsdefinition auch keinen Parameter (calculate). Er wird doch eh nirgendwo eingesetzt.

2) Da du die Funktion ausführen möchtest, wenn der Nutzer die Eingabetaste betätigt, darfst du den Handler nicht vor Aufruf der Funktion beenden, sollte der Key Code 13 (Enter) sein.

Negiere also den Vergleich. Achte zudem darauf, dass das Property keyCode heißt und von numerischen Typ ist.

if (event.keyCode !== 13) {
  return;
}

calculate();

3) Den Wert eines Eingabefeldes erhältst du über das value-Property.

Beispiel:

let fieldValue = document.getElementById("some-field-id").value;

Um ganz sicher zu gehen, dass dieser Wert numerisch ist, wäre es nicht verkehrt, ihn zu parsen.

let fieldValue = parseFloat(document.getElementById("some-field-id").value);

Im Anschluss könnte man sogar prüfen, ob die Eingabe valid ist:

if (isNaN(fieldValue)) {
  // invalid
}

4) Du gibst das Ergebnis nicht aus, sondern lässt z_rotaited auf dein Ergebnis zeigen (nicht mehr auf das div-Element).

Modifiziere diese Zuweisung. Das textContent-Property muss gesetzt werden.

z_rotaited.textContent = result;

Ich habe des Weiteren noch ein paar andere Fehler und Eigenheiten in deiner Syntax entdeckt.

1) Das Semikolon nach dem Körper des if:

if (event.keycode === '13') {
  return
};

ist unnötig. Es stellt dort nur eine leere Anweisung dar.

Was ich eher empfehlen würde: Hänge hinter nichtleere Anweisungen ein Semikolon. Das machst du fast schon überall, nur bei der return-Anweisung noch nicht.

if (event.keycode === '13') {
  return;
}

2) Eines deiner Label verweist auf kein existierendes Eingabefeld.

 <label for="Rotationangleinrad">Rotationangle: </label>

Die Leerzeichen im Wert des for-Attributs müssen entfernt werden.

3) Ein Label darf nicht auf ein nicht existentes Formularfeld zeigen. Das heißt, bei den folgenden Labels müsstest du entweder noch ein Formularfeld mit entsprechender ID ergänzen oder (was wohl eher in Frage kommt) du entfernst das for-Attribut.

<label for = "ComplexversorZ">Complex Number z: </label>
<label for = "Rotationangleφ">Rotationangle φ: </label>

4) Ich würde empfehlen, die verschiedenen Bezeichner noch einmal zu überarbeiten. Bei Bezeichnern, die sich aus verschiedenen Bezeichnern zusammensetzen, bietet sich beispielsweise die Kamelhöckerschreibweise an, um den Namen leichter lesen/erfassen zu können.

Beispiel: rotationAngleInDegree

Sonderzeichen würde ich gänzlich aus Bezeichnern herauslassen.

PhysikInteresse

Fragesteller

20.09.2022, 23:17

Danke für die ausführliche Antwort!^^

Das hat mir weiter geholfen.
Es funktioniert zear immer noch nicht so wie ich will, aber es ist viel besser geworden. x)

Danke. :)

regex9

21.09.2022, 21:44

@PhysikInteresse

Deine mathematische Rechnung habe ich nicht auf Logik überprüft. In der Syntax wäre sie jedenfalls nicht falsch. Wenn du noch an anderer Stelle Fehler hast, müsstest du näher darauf eingehen. Schau zudem in die Browserkonsole (Ctrl + Shift + I > Tab Console), ob dort Fehler aufgeführt werden.

ich habe auf der Seite https://obfuscator.io meinen JavaScript code verschlüsselt.

kann ich vom verschlüsselten code wieder zurück zum javascript code, wenn ja wie?

mein Code:

function be() {
    let eingabe = document.getElementById('password').value;
    if (eingabe == 'das ist gut') {
        re();
    } else {
        alert('Falsches Passwort');
    }
}

function re() {
    let feld = document.getElementById('pas');
    feld.remove();
}

function lock() {
    document.getElementById('bod').innerHTML += `<div class="pass" id="pas">
    <div class="pass-1">
        <div class="pass-2 pass-3">
            <h2>Passwort eingeben um fortzufahren</h2>
        </div>
        <div class="pass-2">
            <input type="password" id="password" placeholder="Passwort eingeben">
        </div>
        <div class="pass-2">
            <button class="pass-4" onclick="be()">Betätigen</button>
        </div>
    </div>
</div>`
}

...zur Frage

Weshalb werden denn die Zahlen immer wieder angezeigt?

Hallo, weshalb werden in folgendem Code beim ersten Aufruf 1*3 angezeigt und beim nächsten mal 11*33? Der Wert ist doch jedes mal gleich? Danke

var parentElement = document.getElementById("test");
parentElement.addEventListener("click", calculate);
function calculate(e){
var childElement = e.target;
var test = childElement.innerHTML;
var result = 1 + test + 3;
childElement.innerHTML = result;
}

...zur Frage

Spotify API Get Methode Blocked?

Moin, hab mal ne Frage, da ich es einfach nicht hin bekomme. Ich habe vor sowas wie eine Musikwunsch Seite für ein Schul Projekt zu coden. Dafür will ich die Spotify API nutzen, damit man über diese Songs suchen kann. Es kommt aber immer in der Netzwerkanalyse der Fehler NS_BINDING_ABORTED, obwohl mein Access Token korrekt ist. Hier ist meine script.js

const API_ENDPOINT = "https://api.spotify.com/v1/search";
const ACCESS_TOKEN = "your_access_token";

function searchSong() {
    let songName = document.getElementById("song-name").value;

    fetch(`${API_ENDPOINT}?q=${songName}&type=track`, {
        headers: {
            "Authorization": `Bearer ${ACCESS_TOKEN}`
        }
    })
    .then(response => response.json())
    .then(data => {
        let songResults = data.tracks.items;

        if (songResults.length > 0) {
            let songList = document.createElement("ul");

            for (let i = 0; i < songResults.length; i++) {
                let song = songResults[i];

                let songItem = document.createElement("li");
                songItem.innerHTML = `<a href="javascript:void(0)" onclick="selectSong('${song.id}')">${song.name} by ${song.artists[0].name}</a>`;

                songList.appendChild(songItem);
            }

            let songResultsDiv = document.getElementById("song-results");
            songResultsDiv.innerHTML = "";
            songResultsDiv.appendChild(songList);
        } else {
            let songResultsDiv = document.getElementById("song-results");
            songResultsDiv.innerHTML = "Sorry, no songs found.";
        }
    })
    .catch(error => {
        const errorMessage = document.getElementById("error-message");
        errorMessage.innerText = error;
    });
}

function selectSong(songId) {
    fetch("db.php", {
        method: "POST",
        body: JSON.stringify({songId: songId}),
        headers: {
            "Content-Type": "application/json"
        }
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            alert("Song added to the list!");
        } else {
            alert("Error adding song to the list.");
        }
    })
    .catch(error => {
        console.log(error);
    });
}

Hier ist dann noch die Index.html:

 <!DOCTYPE html>
<html>
<head>
    <title>DJ Song Request</title>
    <script src="script.js"></script>
</head>
<body>
    <h1>DJ Song Request</h1>
    <form>
        <label for="song-name">Enter song name:</label>
        <input type="text" id="song-name" name="song-name">
        <button type="submit" onclick="searchSong()">Search</button>
    </form>
    <div id="song-results"></div>
</body>
</html>

Vielleicht kann mir ja jemand helfen, da ich echt nicht mehr weiter weiß, im vorraus schon mal Vielen Dank ;D

...zur Frage

JavaScript: Schachbrett Schleifen?

Leute, bitte, ich brauche Hilfe, wer programmieren kann.

Ich habe es versucht, aber keine Ahnung warum, es funktioniert nicht.

Ich wäre sehr dankbar, wenn ich Tipps oder so hier bekommen würde.

Was fehlt? Was ist falsch?

JavaScript:

"use strict";

window.addEventListener("load", init);

let i;
let t;
let tr;
let td;

function init() {
  console.log("Fenster ist geladen");

  let btn = document.getElementById("btn");
  btn.addEventListener("click", btn_angeklickt);
}

function btn_angeklickt() {
  console.log("btn angecklickt");

  let zeilen = document.getElementById("zeilen").value;
  console.log(zeilen);

  let spalten = document.getElementById("spalten").value;
  console.log(spalten);

  let table = document.getElementById("bratan");
  
  for (i = 0; i < spalten.value; i++);
  {
    tr = document.createElement("tr");
    table.appendChild(tr);

    for (t = 0; t < zeilen.value; t++);
    {
      td = document.createElement("td");

      if (i % 2 == t % 2) {
        td.style.backgroundColor = colors[0];
        td.style.height = "60px";
        td.style.width = "60px";
      }
      else {
        td.style.backgroundColor = colors[1];
        td.style.height = "60px";
        td.style.width = "60px";
      }
    }
  }

  tr.appendChild(td);
}

let colors = ["#044272", "#80AB52"];

HTML:

  <label for="Anzahl">Zeilen</label>
  <input type="number" id="zeilen">
  <br><br>
  <label for="Anzahl">Spalten</label>
  <input type="number" id="spalten">
</form>
<br>
<button type="button" id="btn" value="btn">erstelle Schachbrett</button>
<table id="bratan"></table>

...zur Frage

addEventListener nacheinander für mehrere Elemente?

Hi,

ich versuche eine Art Notitzen-App zu coden. Es gibt also eine Seitenleiste in der die verschiedenen Notizen zu sehen sind und wenn diese angeklickt werden, soll der jeweilige Text in der großen textarea angezeigt werden. Bisher habe ich einen Zähler als Variable, der beim Hinzufügen einer neuen Notiz erhöht wird, so wird für jeden neuen Button eine eigene ID erstellt und ich speichere auch alle Notizen in einem Array und kann diese anzeigen lassen. Allerdings muss ich zu jedem Button ein onclick-Element mit der jeweiligen Notiz als Parameter hinzufügen, um sie anzeigen zu können. Das mache ich mit addEventListener. Aber wenn ich einfach document.getElementById(idNames[field]).addEventListener("click", function(){showNotice(toShow)}); verwende, funktioniert der Listener nur für die als letztes hinzugefügte Notitz, wenn ich idNames.forEach(element => document.getElementById(element).addEventListener("click", function(){showNotice(toShow);})) zeigen alle Button beim Klicken natürlich dieselbe Notiz an.

Weiß jemand, was in meinen Fall zu tun ist?

...zur Frage

JS - Canvas: Kann mir bitte jemand genau erklären, was in der for Schleife passiert?

Hallo,

kann mir bitte jemand genau erklären, was in der for-Schleife in der Funktion "drawNumbers" passiert?

var canvas = document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var radius = canvas.height / 2;
ctx.translate(radius, radius);
radius = radius * 0.90

drawNumbers(ctx,radius);

function drawNumbers(ctx, radius) {
  var ang;
  var num;
  ctx.font = radius*0.15 + "px arial";
  ctx.textBaseline="middle";
  ctx.textAlign="center";
  for(num = 1; num < 13; num++){
    ang = num * Math.PI / 6;
    ctx.rotate(ang);
    ctx.translate(0, -radius*0.85);
    ctx.rotate(-ang);
    ctx.fillText(num.toString(),0,0);
    ctx.rotate(ang);
    ctx.translate(0, radius*0.85);
    ctx.rotate(-ang);
  }

...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

Wo liegt der Fehler, dass JavaScript neu hinzugefügte Bilder nicht berücksichtigt?

Hallo,

ich lerne gerade JavaScript.

Um es zu üben, habe ich ein kleines Memoryspiel programmiert. Dabei sollen aus mehreren Bilder per Zufall zehn Bildpaare ausgewählt und auf der Seite angezeigt werden. Als ich heute weiter Bilder eingefügt habe, fiel mir auf, dass die neu hinzugefügten Bilder nicht vom Zufallsgenerator berücksichtigt werden. Leider finde ich den Fehler nicht.

Hier ist mein Code:

const bilder = [
  'Memory/hund1.png',
  'Memory/katze1.png',
  'Memory/blume1.png',
  'Memory/blitz1.png',
  'Memory/hexe.png',
  'Memory/ufo.png',
  'Memory/frau.png',
  'Memory/geist.png',
  'Memory/papagei.png',
  'Memory/schmetterling.png',
  'Memory/taschenuhr.png',
  'Memory/kompass.png',
  'Memory/hasen.png',
  'Memory/springbrunnen.png',
  'Memory/ballon.png',
  'Memory/daenerys.png',
  'Memory/dino.png',
  'Memory/erde.png',
  'Memory/frosch.png',
  'Memory/laub.png',
  'Memory/orange.png',
  'Memory/paar.png',
  'Memory/schloss.png',
  'Memory/teddy.png',
  'Memory/tiger.png',
  'Memory/tropen.png',
  'Memory/wasserfall.png',
  'Memory/biene.png',
  'Memory/mädchen.png',
  'Memory/villa.png',
  'Memory/insel.png',
  'Memory/insel2.png',
  'Memory/wettersymbol.png',
  'Memory/altesauto.png',
  'Memory/ente.png',
  'Memory/kolibri.png',
  'Memory/tinkerbell.png',
  'Memory/fraukatze.png',
  'Memory/vögellaub.png',
  'Memory/sphinx.png',
  'Memory/skulptur.png',
  'Memory/schach.png',
  'Memory/raben.png',
  'Memory/hochhaus.png',
  'Memory/zitronen.png',
  'Memory/lstand.png',
  'Memory/limonade.png',
  'Memory/trinken.png',
  'Memory/hexe2.png',
  'Memory/leuchtturm.png',
  'Memory/leuchtturm2.png',
  'Memory/dänemark.png',
  'Memory/dänemark2.png',
  'Memory/schienen.png',
  'Memory/kuba.png',
  'Memory/havanna.png',
  'Memory/tinkerbell.png',
  'Memory/fraukatze.png',
  'Memory/vögellaub.png',
  'Memory/sphinx.png',
  'Memory/skulptur.png',
  'Memory/schach.png',
  'Memory/raben.png',
  'Memory/hochhaus.png',
  'Memory/zitronen.png',
  'Memory/lstand.png',
  'Memory/limonade.png',
  'Memory/trinken.png',
  'Memory/hexe2.png',
  'Memory/leuchtturm.png',
  'Memory/leuchtturm2.png',
  'Memory/dänemark.png',
  'Memory/dänemark2.png',
  'Memory/schienen.png',
  'Memory/kuba.png',
  'Memory/havanna.png'
];
let karten = [];
let aufgedeckteKarten = 0;
let ersteKarte = null;
let zweiteKarte = null;
let übereinstimmendeKarten = 0;
let spielfeldGesperrt = false;

function kartenMischen() {
  const ausgewählteBilder = bilder.slice(0);
  karten = ausgewählteBilder.sort(() => Math.random() - 0.5);
  karten = karten.slice(0, 10).concat(karten.slice(0, 10));
}

function karteUmdrehen(karte) {
  if (spielfeldGesperrt) return;
  if (karte === ersteKarte) return;

  karte.style.backgroundImage = `url(${karte.dataset.bild})`;

  if (!ersteKarte) {
    ersteKarte = karte;
  }
  else {
    zweiteKarte = karte;
    übereinstimmungPrüfen();
  }
}

function übereinstimmungPrüfen() {
  spielfeldGesperrt = true;

  if (ersteKarte.dataset.bild === zweiteKarte.dataset.bild) {
    übereinstimmendeKarten += 2;

    if (übereinstimmendeKarten === karten.length) {
      alert('Herzlichen Glückwunsch! Du hast gewonnen!');
    }

    kartenDeaktivieren();
  }
  else {
    setTimeout(() => {
      ersteKarte.style.backgroundImage = 'none';
      zweiteKarte.style.backgroundImage = 'none';
      kartenZurücksetzen();
    }, 1000);
  }
}

function kartenDeaktivieren() {
  ersteKarte.removeEventListener('click', () => karteUmdrehen(ersteKarte));
  zweiteKarte.removeEventListener('click', () => karteUmdrehen(zweiteKarte));
  kartenZurücksetzen();
}

function kartenZurücksetzen() {
  [ersteKarte, zweiteKarte] = [null, null];
  spielfeldGesperrt = false;
}

const spielfeld = document.getElementById('spielfeld');
kartenMischen();

for (let i = 0; i < karten.length; i++) {
  const karte = document.createElement('div');
  karte.classList.add('karte');
  karte.dataset.bild = karten[i];
  karte.style.backgroundImage = 'none';
  karte.addEventListener('click', () => karteUmdrehen(karte));
  spielfeld.appendChild(karte);
}

Es wäre schön wenn mir jemand sagt, wo mein Fehler liegt.

Danke

...zur Frage

Was ist da schief (JS)?

Starte ich das Programm so beginnt es so wie ich es will. Irgendwann wird dann aber ein Fehler gezeigt

("main.js:27 Uncaught TypeError: Cannot read properties of null (reading 'setAttribute')

at ClickIt (main.js:27)

at clickvol2 (main.js:21)

at HTMLParagraphElement.<anonymous> (main.js:30))

und mehrere Flächen farbig markiert und man muss manchmal doppelt klicken. Wo liegt hier der Fehler?

JS:
"use strict";

let genNum = function() {

let gen = Math.random() * 9;

let num = Math.round(gen);

let numers = ["null", "eins", "zwei", "drei", "vier", "fünf", "sechs", "sieben", "acht", "neun"];

let final = (numers[num]);

if(final === "zehn") {

genNum()

}

return final;

};

let i = 0;

document.getElementById("Punkteanzahl").textContent = i;

let clickvol2 = function() {

if (document.querySelector("#eins", "#zwei", "#drei", "#vier", "#fünf", "#sechs", "#sieben", "#acht", "#neun").hasAttribute("class")) {

console.log(".")

} else {

ClickIt(genNum())

}};

let ClickIt = function(num) {

let hash = "#";

let ident = hash.concat(num);

document.querySelector(ident).setAttribute("class", "click");

document.querySelector(ident).addEventListener("click", function() {

document.querySelector(ident).removeAttribute("class");

clickvol2();

i++;

})

};

ClickIt(genNum());

console.log(document.getElementById("Punkteanzahl").textContent)

...zur Frage

stimmt dieser code?

ich hab was ausprobiert aber da scheint was falsch zu sein, sieht man einen Fehler auf den ersten blick?

schreibe den javascript code für ein spiel und erkläre hinterher wie es funktioniert

// variablen
let score = 0;
let time = 10;

// Elemente im HTML-Dokument auswählen
const scoreDisplay = document.getElementById('score');
const timeDisplay = document.getElementById('time');
const startButton = document.getElementById('start-button');
const gameArea = document.getElementById('game-area');

// Start
startButton.addEventListener('click', startGame);

function startGame() {
  startButton.disabled = true;
  score = 0;
  time = 10;
  scoreDisplay.textContent = score;
  timeDisplay.textContent = time;
  gameArea.addEventListener('click', increaseScore);
  countdown();
}

// Punktzahl erhöhen
function increaseScore() {
  score++;
  scoreDisplay.textContent = score;
}

// Countdown-Funktion
function countdown() {
  const timer = setInterval(() => {
    time--;
    timeDisplay.textContent = time;
    
    if (time === 0) {
      clearInterval(timer);
      endGame();
    }
  }, 1000);
}

// ende
function endGame() {
  gameArea.removeEventListener('click', increaseScore);
  startButton.disabled = false;
  alert('Deine Punktzahl: ' + score);
}

Der Code beginnt mit der Initialisierung einiger Spielvariablen:

(Punktzahl) und

(Zeit). Diese Variablen werden später im Spiel verwendet, um den Fortschritt des Spielers zu verfolgen.

Als Nächstes werden einige Elemente im HTML-Dokument ausgewählt, die zur Anzeige und Interaktion mit dem Spiel verwendet werden. Dazu gehören das Element, das die Punktzahl anzeigt (

), das Element, das die verbleibende Zeit anzeigt (

timeDisplay

), der Startbutton (

startButton

) und das Spielfeld (

gameArea

startButton

erhält einen Eventlistener, der auf das Klicken des Buttons reagiert. Sobald der Startbutton geklickt wird, wird die Funktion

startGame

aufgerufen.

Die Funktion

startGame

wird aufgerufen, wenn das Spiel gestartet wird. Sie deaktiviert den Startbutton, setzt die Punktzahl und die verbleibende Zeit auf ihre Ausgangswerte zurück und aktualisiert die Anzeige entsprechend. Ein Eventlistener wird dem Spielfeld hinzugefügt, um auf Klicks des Spielers zu reagieren und die Punktzahl zu erhöhen. Die Funktion

countdown

wird aufgerufen, um den Countdown zu starten.

Die Funktion

increaseScore

wird aufgerufen, wenn der Spieler auf das Spielfeld klickt. Sie erhöht die Punktzahl um eins und aktualisiert die Anzeige entsprechend.

Die Funktion

countdown

startet den Countdown von 10 Sekunden. Dazu wird ein Timer mit

setInterval

verwendet, der alle 1000 Millisekunden (1 Sekunde) die verbleibende Zeit um eins verringert und die Anzeige aktualisiert. Wenn die Zeit auf 0 reduziert wird, wird der Timer mit

clearInterval

gestoppt, und die Funktion

endGame

wird aufgerufen.

Die Funktion

endGame

beendet das Spiel. Sie entfernt den Eventlistener vom Spielfeld, aktiviert den Startbutton wieder und zeigt eine Benachrichtigung an, die die erreichte Punktzahl des Spielers anzeigt..

...zur Frage

Werte aus Datenbank anzeigen mit JS?

Hallo,

ich habe folgenden Code für mein Formular:

<form action="/message1" method="post">
  <div class="input">
    <input type="text" placeholder="Chat" id="input" name="input1">
  </div>
  <div class="send">
    <button type="submit" onclick="message();">Send</button>
  </div>
</form>

Nun noch das JS onclick-Event:

function message() {
  input = document.getElementById("input").value;
  count++;

  if (input == "") {
    alert("please type your message!");
  }
  else {
    if (count % 2 == 0) {
      let newDiv = document.createElement("div");
      newDiv.id = "divMessage";
      newDiv.style.display = "flex";
      newDiv.style.justifyContent = "flex-start";
      newDiv.style.margin = "45px";
      newDiv.style.backgroundColor = "#303032";
      newDiv.style.borderRadius = "10px";
      newDiv.style.padding = "10px";
      newDiv.style.marginTop = "80px";
      newDiv.style.color = "white";
      newDiv.style.marginBottom = "80px";
      newDiv.style.width = "120px";
      newDiv.innerHTML = input;

      let chatMessages = document.querySelector(".chat-messages");
      chatMessages.appendChild(newDiv);
    }

Und nun noch das Reinschreiben mit node.js in die MariaDB-Datenbank:

app.post('/message1', async (req, res) => {
  const input = req.body.input1;
  console.log(input);
  const conn = await pool.getConnection();
  await conn.query(`INSERT INTO test.handy (id, name) VALUES (2, '${input}')`);
  conn.release();
});

Nun möchte ich aber, das, was in die Datenbank geschrieben wurde, beim Aktualisieren der Seite immer noch im "newDiv" anzeigen. Wie geht das?

...zur Frage

Browserfehler: "0: Unable to get property 'SavePersonalAndPaymentData' of undefined or null reference"?

Hallo,

ich habe eine Aufgabe gemacht und mein Browser gibt diesen Fehler aus:

0: Unable to get property 'SavePersonalAndPaymentData' of undefined or null reference

Ich glaube aber, dass die Aufgabe richtig ist!

Ich habe es auch einen Freund geschickt und bei ihm funktioniert es ebenfalls nicht.

HTML:

<!DOCTYPE html>
<html>
  <head lang="de">
    <meta charset="UTF-8" />
    <style type="text/css"></style>
    <title>Lieblings Professor</title>
  </head>
  <body>
    <form>
      <fieldset>
        <legend>Notenberechnung<br>Teilaufgaben</legend>

        <label for="aufgabe1">Aufgabe 1:</label>
        <input type="number" name="Augabe1" id="a">
        <br><br>

        <label for="aufgabe2">Aufgabe 2:</label>
        <input type="text" name="Aufgabe2" id="b">
        <br><br>

        <label for="aufgabe3">Aufgabe 3:</label>
        <input type="number" name="Augabe3" id="c">
        <br><br>

        <label for="aufgabe4">Aufgabe 4:</label>
        <input type= "number" name="Augabe4" id="d">
        <br><br>

        <button id="069" value="069">druck berechne</button>
      </fieldset>
    </form>
    <h1>Note</h1>
    <div id="note"></div>
    <script src="x1.js"></script>
  </body>
</html>
</form>
<h1>Note</h1>
<div id="note"></div>
<script src="x1.js"></script>
</body>
</html>

JavaScript:

"use strict"

window.addEventListener("load", init);

function init() {
  console.log("Fenster ist geladen");
  let btn = document.getElementById("069");
  btn.addEventListener("click", btnfk);

  function btnfk() {
    console.log("ich wurde geklickt!!!!");

    let aufgabe1 = document.getElementById("a").value;
    console.log(aufgabe1);
    let aufgabe2 = document.getElementById("b").value;
    console.log(aufgabe2);
    let aufgabe3 = document.getElementById("c").value;
    console.log(aufgabe3);
    let aufgabe4 = document.getElementById("d").value;
    console.log(aufgabe4);

    aufgabe1 = Number(aufgabe1);
    aufgabe2 = Number(aufgabe2);
    aufgabe3 = Number(aufgabe3);
    aufgabe4 = Number(aufgabe4);

    let note = document.getElementById("note");
    global = global + aufgabe1 + aufgabe2 + aufgabe3 + aufgabe4;

    note.textContent = global;
    let note5 = document.createElement("div");
    document.body.appendChild(note5);

    if (global < 12) {
      note5.textContent = "Ihre Note ist 5!!!!!";
    }

    if (global >= 12 && global <= 15) {
      note5.textContent = "Ihre Note ist 4 ...";
    }

    if (global >= 15 && global <= 18) {
      note5.textContent = "Ihre Note ist 3";
    }

    if (global >= 18 && global <= 21) {
      note5.textContent = "Ihre Note ist 2 super";
    }

    if (global >= 21) {
      note5.textContent = "Ihre Note ist 1 WOW";
    }
  }
}

let global = 0;

Wenn ich statt Zahlen aber Buchstaben eingebe, werden sie gespeichert. Ansonsten mit Zahlen werden sie nicht gespeichert und verschwindet sofort.

...zur Frage

Automatisch Scrollen?

Hallo,

auf meiner Website hab ich 2 Icons, die durch eine Klick Funktion jeweils ein Div darunter erscheinen lassen.

Sobald ein Div erscheint oder ich die passende Klasse hinzufüge soll nun zu den passenden Div runter oder zum Seitenanfang gescrollt werden.

Wo liegt der Fehler ?...ich steh etwas aufm Schlauch.

Das Problem muss nicht unbedingt mit einer Scroll function gelöst werden =)

function klick() {
    let hauptDiv = document.getElementById('div_eins');


    if (hauptDiv.classList.contains('unsichtbar') == true) {
        hauptDiv.classList.remove('unsichtbar');
        hauptDiv.classList.add('sichtbar');
        window.scrollTo(0, 100);
    } else if (hauptDiv.classList.contains('sichtbar') == true) {
        hauptDiv.classList.remove('sichtbar');
        hauptDiv.classList.add('unsichtbar');
    }   else {
           return;
        }
    }

...zur Frage

Verstehe nicht, warum es falsch ist?

// loggen der Variabeln-Name für den Login-Button //

let loggen = document.getElementById("login");


loggen.addEventListener("click", function() {
  
// eingabeFeld ist der Name für das Inputfeld //  
let eingabeFeld = document.getElementById("field");

eingabeFeld.value;
if (eingabeFeld.includes("huso1234")) {
alert("Ja, das Passwort ist richtig");
}
else {
    alert("Das Passwort ist falsch");
}
eingabeFeld.textContent = "";
});

Funktioniert halt einfach nicht. Es handelt sich hierbei um die Programmiersprache JavaScript. Es kommt kein Alert und am Ende geht der Text auch nicht weg vom Inputfeld.

...zur Frage

Was möchtest Du wissen?

Deine Frage stellen