Verwandte Themen

Frage
von Xxxoo56
09.12.2023, 20:57
Mit Bildern
Wie kriege ich wenn ich meine PHP-Seite öffnen möchte denn Error / Fehlmeldung behoben?

mir kommt immer diese Fehlmeldung erscheint:

Hier ist der PHP-Code: 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<?php
$vorname=$_POST['vorname'];
$nachname=$_POST['nachname'];
$strasse_und_hausnummer=$_POST['strasse_und_hausnummer'];
$plz=$_POST['plz'];
$ort=$_POST['ort'];
$telefonnummer=$_POST['telefonnummer'];
$e_mail_adresse=$_POST['e_mail_adresse'];
$pizzasorten=$_POST['pizzasorten'];
$pizzaanzahl=$_POST['pizzaanzahl'];
$groesse_preis=$_POST['groesse_preis'];
$getraenk=$_POST['getraenk'];
$dip=$_POST['dip']; 
$lieferoptionen=$_POST['lieferoptionen'];
$stammkundenkarte=$_POST['stammkundenkarte'];
$bemerkungen=$_POST['bemerkungen'];
$rabatt1=0.05; 
$rabatt2=0.10;
$lieferkosten=4.99;
$zahlung=$groesse_preis*$pizzaanzahl;
$zahlungsbetrag1=$zahlung-($zahlung*$rabatt1); 
$zahlungsbetrag2=$zahlung-($zahlung*$rabatt2);
$zahlungsbetrag3=$zahlung-($zahlung*$rabatt2)+$lieferkosten;
$zahlungsbetrag4=$zahlung-($zahlung*$rabatt1)+$lieferkosten;

 

$gewaehlter_dip = array ( "Knoblauchsauce", "BBQ-Sauce", "Cocktailsauce", "Kein Dip");

 

$gewaehlte_pizzen = array(
    $pizzasorten [0] => "Margherita",
    $pizzasorten [1] => "Pepperoni", 
    $pizzasorten [2] => "Funghi",
    $pizzasorten [3] => "Quattro Formaggi",
    $pizzasorten [4] => "Diavola",
    $pizzasorten [5] => "Veggie Delight",
    $pizzasorten [6] => "Eigenkreation" );

$gewaehlte_pizzen = explode(",", $pizzasorten);

 

foreach ($gewaehlte_pizzen as $gewaehlte_pizza) {
    echo "<p>Sie haben die Pizzasorte " . $gewaehlte_pizza . " ausgewählt.</p>";}

 

foreach ($gewaehlter_dip as $gewaehlter_dip){
         if ($dip != "Kein Dip")
     {
       echo "<p>Sie haben die $dip ausgewählt.</p>";
     break;
     }
        }
    
  if ($pizzaanzahl >= 3 AND $stammkundenkarte == "Nein") 
     {
     echo "<p>Vielen Dank, $vorname $nachname, für Ihre Bestellung!<br />
           Der Zahlungsbetrag beträgt: $zahlungsbetrag1 €(5% Rabatt wurde gewährt).<br />
           Wir freuen uns darauf, Ihnen Ihre $pizzaanzahl Pizza/Pizzen und $getraenk zu liefern!</p>";}   
      
  elseif ($pizzaanzahl >= 3 AND $stammkundenkarte == "Ja") 
         {
         echo "<p>Vielen Dank, $vorname $nachname, für Ihre Bestellung!<br />
               Der Zahlungsbetrag beträgt: $zahlungsbetrag2 € (10% Rabatt wurde gewährt).<br />
               Wir freuen uns darauf, Ihnen Ihre $pizzaanzahl Pizza/Pizzen und $getraenk zu liefern!</p>";} 
       
  elseif ($pizzaanzahl < 3 AND $stammkundenkarte == "Ja") 
       {
         echo "<p>Vielen Dank, $vorname $nachname, für Ihre Bestellung!<br />
           Der Zahlungsbetrag beträgt: $zahlungsbetrag3 € (10% Rabatt wurde gewährt inkl. der Lieferkosten).<br />
         Wir freuen uns darauf, Ihnen Ihre $pizzaanzahl Pizza/Pizzen und $getraenk zu liefern!<br /> 
               Wir schätzen Ihre Treue als Stammkunde!</p>";} 
       
  else {
        echo "<p>Vielen Dank, $vorname $nachname, für Ihre Bestellung!<br />
           Der Zahlungsbetrag beträgt: $zahlungsbetrag4 €(5% Rabatt wurde gewährt inkl. der Lieferkosten).<br />
           Wir freuen uns darauf, Ihnen Ihre $pizzaanzahl Pizza/Pizzen und $getraenk zu liefern!</p>";} 
       
?>
</body>
</html>
Bild zu Frage
HTML, Webseite, MySQL, PHP, Programmiersprache, Webentwicklung
3 Antworten
Frage
von Xxxgs
08.12.2023, 16:02
Mit Bildern
Könnte mir jemand bei der Programmierung meines Kontaktformulars helfen?

das rechte Absende Button ist keiner als das linke Abbrechen Button und kriege es nicht hin sie in der gleichen Größe könnte mir da vielleicht jemand helfen.

hier ist der HTML-Code dazu: 

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Bestellformular</title>
<meta name="description" content="Bestellformular" />
<link href="style.css" type="text/css" rel="stylesheet" />
</head>
<body>
<form action="Pizzeria.php" method="post">
<table width="50" align="left">
<h1> Bestellformular zum Jubil&auml;um </h1>
<b>Kundeninformationen</b>
<tr><td colspan="1">
    Vorname: </td><td>
    <input type="text" name="vorname"  value=""  size="30" maxlength="" />
</td></tr><tr><td>
  Nachname: </td><td> 
  <input type="text" name="nachname" value="" size="30" maxlength="" />
</td></tr><tr><td>
  Stra&szlig;e & Hausnr.: </td><td>
  <input type="text" name="strasse_und_hausnummer" value="" size="30" maxlength="" />
</td></tr><tr><td>
  PLZ: </td><td>
  <input type="text" name="plz" value="" size="30" maxlength="" />
</td></tr><tr><td>
  Ort: </td><td>
  <input type="text" name="ort" value="" size="30" maxlength="" />
</td></tr><tr><td>
  Telefonnummer: </td><td>
  <input type="text" name="telefonnummer" value="" size="30" maxlength="" />
</td></tr><tr><td>
  E-Mail-Adresse: </td><td>
  <input type="email" name="e_mail_adresse" value="" size="30" maxlength="" />
</td></tr><tr><td valign="top" >
  Pizzasorten: </td><td> 
  <select name="pizzasorten" size="7" >
    <option value="margherita" selected="">Margherita</option>
    <option value="pepperoni">Pepperoni</option>
    <option value="funghi">Funghi</option>
    <option value="quattro formaggi">Quattro Formaggi</option>
    <option value="diavola">Diavola</option>
    <option value="veggie delight">Veggie Delight</option>
    <option value="eigenkreation">Eigenkreation</option>
  </select>
</td></tr><tr><td>
  Pizzaanzahl: </td><td>
  <input type="text" name="pizzaanzahl" value="" size="20" maxlength="" />
</td></tr><tr><td>
  Pizzagr&ouml;&szlig;e & Jubil&auml;umspreise: </td><td>
  <select name="groesse_preis" >
        <option value="small" selected="selected"> Small (&#8960;25cm): 10,49 € </option>
        <option value="medium"> Medium (&#8960;28cm): 11,99 €</option>
        <option value="large"> Large(&#8960;32cm): 14,99 €</option>
    </select>
<br/><br/></td></tr><br/><tr><td valign="top">
    Getr&auml;nk:</td><td>
  <input type="radio" name="getraenk" value="Coca_Cola" /> 
  Coca-Cola (0,5l) <br />
  <input type="radio" name="getraenk" value="Sprite" /> 
  Sprite (0,5l) <br />
  <input type="radio" name="getraenk" value="Fanta" /> 
  Fanta (0,5l) <br />
  <input type="radio" name="getraenk" value="Wasser" /> 
  Wasser (0,5l) 
<br/><br/></td>
</td></tr><tr><td>
  Lieferoptionen:</td><td>
  Abholung
  <input type="radio" name="lieferoptionen" value="Abholung" checked="" />
  Lieferung
  <input type="radio" name="lieferoptionen" value="Lieferung" />
</td></tr><tr><td>
    Stammkundenkarte:</td><td>
  Ja
  <input type="radio" name="stammkundenkarte" value="Ja" checked="" />
  Nein
  <input type="radio" name="stammkundenkarte" value="Nein"/>
</td></tr><tr><td>

 

<br/><br/></td></tr><br/><tr><td valign="top" />
  Bemerkungen:</td><td>
  <textarea name="bemerkungen" cols="30" rows="5"></textarea>
</td></tr><tr><td>
<br/></td></tr><br/><tr><td/>
<input type="Reset" name="" value="Abbrechen" /> </td><td>
<input type="Submit" name="send" value="Absenden" />
</table>
</form>
</body>
</html>
Bild zu Frage
HTML, Webseite, PHP
1 Antwort
Frage
von Noway28YT
07.12.2023, 13:38
HTML Taschenrechner?

Hey ich habe einen HTML Taschenrechner von einer Website kopiert von einer Website und ich will jetzt den Taschenrechner so programmieren das er nicht über hundert rechen kann bzw. Eine Fehler Meldung dann kommt so das immer ein Fehler kommt wenn ich über hundert rechnen tun ich hab schon im Internet mich belesen aber finde nix leider vielleicht könnt ihr mir helfen

<html>
<head>
<title>HTML-Taschenrechner </title>
</head>
<body bgcolor= "# 000000" text= "gold">
<form name="calculator" >
<input type="button" value="1" onClick="document.calculator.ans.value+='1'">
<input type="button" value="2" onClick="document.calculator.ans.value+='2'">
<input type="button" value="3" onClick="document.calculator.ans.value+='3'">
<input type="button" value="+" onClick="document.calculator.ans.value+='+'">
<input type="button" value="4" onClick="document.calculator.ans.value+='4'">
<input type="button" value="5" onClick="document.calculator.ans.value+='5'">
<input type="button" value="6" onClick="document.calculator.ans.value+='6'">
<input type="button" value="-" onClick="document.calculator.ans.value+='-'">
<input type="button" value="7" onClick="document.calculator.ans.value+='7'">
<input type="button" value="8" onClick="document.calculator.ans.value+='8'">
<input type="button" value="9" onClick="document.calculator.ans.value+='9'">
<input type="button" value="*" onClick="document.calculator.ans.value+='*'">
<input type="button" value="/" onClick="document.calculator.ans.value+='/'">
<input type="button" value="0" onClick="document.calculator.ans.value+='0'">
<input type="reset" value="Reset">
<input type="button" value="=" onClick="document.calculator.ans.value=eval(document.calculator.ans.value)">
Solution is
<input type="textfield" name="ans" value="">
</form>
</body>
</html>

LG

HTML, Webseite, HTML5, Code, Programmiersprache, Webdesign, Webentwicklung
3 Antworten
Frage
von SomeDude2304732
06.12.2023, 19:13
Mit Links
http zu https redirect-Fehler auf Wordpress-Seite?

Ich habe eine Wordpress-Website, nennen wir sie example.com, die von IONOS gehostet wird. Es handelt sich um eine HTTPS-Website mit einem funktionierenden SSL-Zertifikat, sodass alle HTTP-Anfragen auf die angeforderte Seite umgeleitet werden sollten, aber dabei das HTTP durch HTTPS ersetzt wird.

Beispiel: http://example.com sollte auf https://example.com umgeleitet werden (das funktioniert). http://example.com/subpage sollte auf https://example.com/subpage umgeleitet werden (das funktioniert jedoch nicht!). Stattdessen passiert Folgendes: http://example.com/subpage leitet auf https://example.com/ um.

Das Hauptproblem dabei ist, dass die Google Search Console fälschlicherweise einen Umleitungsfehler für jede Unterseite erkennt, die sie zu indexieren versucht, obwohl die Indexanfrage speziell für die HTTPS-Seite (https://example.com/subpage) gesendet wurde.

Ich verwende die neueste Version von Wordpress. Die derzeit installierten Plugins sind:

  • Advanced Import
  • Duplicate Page
  • Elementor Pro
  • IONOS Assistant (deaktiviert)
  • IONOS Help (deaktiviert)
  • IONOS Journey (deaktiviert)
  • IONOS Login
  • IONOS Loop (deaktiviert)
  • IONOS Navigation
  • IONOS Performance
  • IONOS Security
  • Music Player for Elementor
  • Title Remover
  • WPvivid Backup Plugin
  • Yoast SEO Premium

Diese Teile meiner .htaccess-Datei könnten für das Problem verantwortlich sein:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{SERVER_PORT} 80
    RewriteRule ^(/(.*))?$ https://%{HTTP_HOST}/$1 [R=301,L]
</IfModule>

und/oder:

<IfModule mod_rewrite.c>
    # ENGINE ON
    RewriteEngine on

    # set hostname directory
    RewriteCond %{HTTPS} on
    RewriteRule .* - [E=IONOS_PERFORMANCE_HOST:https-%{HTTP_HOST}]

    RewriteCond %{HTTPS} off
    RewriteRule .* - [E=IONOS_PERFORMANCE_HOST:%{HTTP_HOST}]

    # set subdirectory
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_METHOD} GET
    RewriteCond %{REQUEST_URI} !(.*)/$
    RewriteCond %{REQUEST_FILENAME} !.(gif|jpg|png|jpeg|css|xml|txt|js|php|scss|webp|mp3|avi|wav|mp4|mov)$ [NC]
    RewriteRule .* - [E=IONOS_PERFORMANCE_DIR:%{REQUEST_URI}/]

    RewriteCond %{REQUEST_URI} /$
    RewriteRule .* - [E=IONOS_PERFORMANCE_DIR:%{REQUEST_URI}]

    RewriteCond %{REQUEST_URI} ^$
    RewriteRule .* - [E=IONOS_PERFORMANCE_DIR:/]

    # gzip
    RewriteRule .* - [E=IONOS_PERFORMANCE_SUFFIX:]
    <IfModule mod_mime.c>
        RewriteCond %{HTTP:Accept-Encoding} gzip
        RewriteRule .* - [E=IONOS_PERFORMANCE_SUFFIX:.gz]
        AddType text/html .gz
        AddEncoding gzip .gz
    </IfModule>

    # Main Rules
    RewriteCond %{HTTP_ACCEPT} .*text/html.*
    RewriteCond %{ENV:INITIAL_REQUEST_METHOD} ^$
    RewriteCond %{ENV:REDIRECT_INITIAL_REQUEST_METHOD} ^$
    RewriteCond %{QUERY_STRING} ^$
    RewriteCond %{REQUEST_URI} !^/(wp-admin|wp-content/cache)/.*
    RewriteCond %{HTTP_COOKIE} !(wp-postpass|wordpress_logged_in|comment_author)_
    RewriteCond /homepages/9/d4297862886/htdocs/./wordpress/wp-content/cache/ionos-performance/%{ENV:IONOS_PERFORMANCE_HOST}%{ENV:IONOS_PERFORMANCE_DIR}index.html%{ENV:IONOS_PERFORMANCE_SUFFIX} -f
    RewriteRule ^(.*) /wp-content/cache/ionos-performance/%{ENV:IONOS_PERFORMANCE_HOST}%{ENV:IONOS_PERFORMANCE_DIR}index.html%{ENV:IONOS_PERFORMANCE_SUFFIX} [L]
</IfModule>

und/oder:

<IfModule mod_rewrite.c>
RewriteEngine On
RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

Meine Permalink-Einstellung in Wordpress ist wie folgt:

https://example.com/%category/%postname%/
Homepage, HTML, Webseite, WordPress, Webentwicklung, Webserver, htaccess, ionos
2 Antworten
Frage
von GeldGeil457
05.12.2023, 15:38
Frage wurde 1 Mal erneut gestellt
Mit Links
Wie klicke ich auf diese Elemente mit Python und Selenium?

Hallo,

Ich versuche, auf die folgenden Elemente auf dieser Webseite (https://www.bing.com/search?q=Bing+AI&showconv=1&FORM=hpcodx) mit Python und Selenium zu klicken.

//*[@id=“tone-options”]/li[3]/button

//*[@id=“camera-container”]/button

//*[@id=“camera-container”]/cib-flyout/cib-visual-search//div[3]/button[1]

Ich habe XPATH, CSS probiert.

Fehler:

selenium.common.exceptions.NoSuchElementException: Message: no such element: Unable to locate element: {"method":"xpath","selector":"//*[@id="tone-options"]/li[3]/button"}

 (Session info: chrome=119.0.6045.200)

Stacktrace:

GetHandleVerifier [0x00007FF7D97B82B2+55298]

(No symbol) [0x00007FF7D9725E02]

(No symbol) [0x00007FF7D95E05AB]

(No symbol) [0x00007FF7D962175C]

(No symbol) [0x00007FF7D96218DC]

(No symbol) [0x00007FF7D965CBC7]

(No symbol) [0x00007FF7D96420EF]

(No symbol) [0x00007FF7D965AAA4]

(No symbol) [0x00007FF7D9641E83]

(No symbol) [0x00007FF7D961670A]

(No symbol) [0x00007FF7D9617964]

GetHandleVerifier [0x00007FF7D9B30AAB+3694587]

GetHandleVerifier [0x00007FF7D9B8728E+4048862]

GetHandleVerifier [0x00007FF7D9B7F173+4015811]

GetHandleVerifier [0x00007FF7D98547D6+695590]

(No symbol) [0x00007FF7D9730CE8]

(No symbol) [0x00007FF7D972CF34]

(No symbol) [0x00007FF7D972D062]

(No symbol) [0x00007FF7D971D3A3]

BaseThreadInitThunk [0x00007FF8125E7344+20]

RtlUserThreadStart [0x00007FF8130026B1+33]

kann mir jemand helfen? Danke.

HTML, Webseite, CSS, HTML5, Code, PHP, Programmiersprache, Python, Webdesign, Webentwicklung, Frontend, Python 3, Selenium
1 Antwort
Frage
von SusgUY446
05.12.2023, 10:32
Mit Bildern
wie kann man das beheben?

sidebar.css.sidebar {
    position: fixed;
    top: 0;
    right: -300px;
    width: 300px;
    height: 100%;
    background-color: #333;
    transition: right 0.3s ease; 
  }
  
  .sidebar-open {
    right: 0;
  }

.sidebar ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    position: relative;
}


.sidebar li {
    float: left;
  }

.sidebar li a {
    display: block;
    color: white;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
}
  
.sidebar li a:hover {
    background-color: #111;
}

 

  private.php

<?php
session_start();
if(!isset($_SESSION["username"])){
  header("Location: index.php");
  exit;
}
$username = $_SESSION["username"];
 ?>
<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    
    <!-- Import Styles -->
    <link rel="stylesheet" href="cnd/css/loader.css">
    <link rel="stylesheet" href="cnd/css/container.css">
    <link rel="stylesheet" href="cnd/css/color-changer.css">
    <link rel="stylesheet" href="cnd/css/background.css">
    <link rel="stylesheet" href="cnd/css/navbar.css">
    <link rel="stylesheet" href="cnd/css/sidebar.css">
    
    <title>Your Personal Site</title>

    <!-- import scripts -->
    <script src="cnd/js/sidebar.js"></script>
    <script src="cnd/js/loader.js"></script>

    <script>
        
        const imageFiles = [
            'baldur.jpg',
            'baldur2.jpg',
            'baldur3.jpg',
            
        ];

        
        function setRandomImage() {
            const randomIndex = Math.floor(Math.random() * imageFiles.length);
            const randomImage = imageFiles[randomIndex];
            const imgElement = document.querySelector('.random-img');
            imgElement.src = `/personal-site/images/${randomImage}`; 
        }

        
       
    </script>
    <script>
        

        function setColor(color) {
            document.body.style.backgroundColor = color;
        }

        
    </script>


  </head>
  <body>
    
  <div class="loader"></div>
  
  <div class="container">
      <h1>Hallo <?php echo $username?></h1>
      <img src="" alt="random image of my dog" width="900px" height="900px" class="random-img">
      
    <script>
      setRandomImage();
    </script>
    <style>
      .dropdown {
        position: relative;
        display: inline-block;
      }

      .dropdown-content {
        display: none;
        position: absolute;
        background-color: #f9f9f9;
        min-width: 160px;
        box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
        padding: 12px 16px;
        z-index: 1;
      }

      .dropdown:hover .dropdown-content {
          display: block;
      }

    </style>
    

  </div>
  
  <div class="dropdown">
    <span>Change Color</span>
    <div class="dropdown-content">
      <div class="color-changer">
        <button onclick="setColor('green')" class="button-green">Green</button>
        <button onclick="setColor('red')" class="button-red">Red</button>
        <button onclick="setColor('blue')" class="button-blue">Blue</button>
      </div>
    </div>
    </div>
    
    <div class="navbar">
      <ul>
        <li>
          <a href="index.php">Home</a>
        </li>
        <li>
          <a href="games.php">Games</a>
        </li>
        <li class="account-dropdown">
          <a href="">Account
      </li> 
      </ul>
    </div>

    <div class="sidebar" id="sidebar">
      <ul>


        <li>
          <a href="">Home</a><br>
        </li>

        <li>
          <a href="">Pricing</a><br>
        </li>

        <li>
          <a href="">Settings</a><br>
        </li>
      </ul>
    </div>

  </body>
</html>
Bild zu Frage
Homepage, HTML, Webseite, CSS, JavaScript, HTML5, Code, PHP, Programmiersprache, Webdesign, Webentwicklung, Frontend, Visual Studio Code
1 Antwort
Frage
von MrOsmo
03.12.2023, 22:31
javascript hilfe dringendd?

Hallo zusammen!

Ich habe angefangen eine ToDoListe zu machen und bin schon fast fertig. Allerdings muss ich noch zwei Buttons fertigen und ich weiss nicht wie. Das erste Button ist "Delete All", dieser sollte alle Aufgaben (Aufgaben der ToDoListe) löschen. Das zweite ist "Change Status", dieser sollte, sofort alle Aufgaben wegstreichen oder zeigen dass diese Aufgaben gemacht worden sind. Ich hoffe auf eure Hilfen!

Bin schon richtig müde, und muss die Aufgaben schon bis morgen abschicken..

Dankeschön im Voraus!

LG

const todoInput = document.querySelector(".todo-input");
const todoInputTwo = document.querySelector(".todo-input-two")
const todoButton = document.querySelector(".todo-button");
const todoList = document.querySelector(".todo-list");
const filterOption = document.querySelector(".filter-todo");
const deleteAllTodos = document.querySelector(".deleteAll button")


document.addEventListener("DOMContentLoaded", getLocalTodos);
todoButton.addEventListener("click", addTodo);
todoList.addEventListener("click", deleteCheck);
filterOption.addEventListener("change", filterTodo);


function addTodo(event) {
    event.preventDefault();
    const todoDiv = document.createElement("div");
    todoDiv.classList.add("todo");
    const newTodo = document.createElement("li");
    newTodo.innerText = `${todoInput.value}, Date: ${todoInputTwo.value}`; 
    newTodo.classList.add("todo-item");
    todoDiv.appendChild(newTodo);
+
    saveLocalTodos(todoInput.value);
    
    const completedButton = document.createElement("button");
    completedButton.innerHTML = '<i class="fas fa-check-circle"></li>';
    completedButton.classList.add("complete-btn");
    todoDiv.appendChild(completedButton);


    const trashButton = document.createElement("button");
    trashButton.innerHTML = '<i class="fas fa-trash"></li>';
    trashButton.classList.add("trash-btn");
    todoDiv.appendChild(trashButton);
    
    todoList.appendChild(todoDiv);
    todoInput.value = "";
}


function deleteCheck(e) {
    const item = e.target;


    if(item.classList[0] === "trash-btn") {
        const todo = item.parentElement;
        todo.classList.add("slide");


        removeLocalTodos(todo);
        todo.addEventListener("transitionend", function() {
            todo.remove();
        });
    }


    if(item.classList[0] === "complete-btn") {
        const todo = item.parentElement;
        todo.classList.toggle("completed");
    }
}


function filterTodo(e) {
    const todos = todoList.childNodes;
    todos.forEach(function(todo) {
        switch(e.target.value) {
            case "all": 
                todo.style.display = "flex";
                break;
            case "completed": 
                if(todo.classList.contains("completed")) {
                    todo.style.display = "flex";
                } else {
                    todo.style.display = "none";
                }
                break;
            case "incomplete":
                if(!todo.classList.contains("completed")) {
                    todo.style.display = "flex";
                } else {
                    todo.style.display = "none";
                }
                break;
        }
    });
}


function saveLocalTodos(todo) {
    let todos;
    if(localStorage.getItem("todos") === null) {
        todos = [];
    } else {
        todos = JSON.parse(localStorage.getItem("todos"));
    }
    todos.push(todo);
    localStorage.setItem("todos", JSON.stringify(todos));
}


function getLocalTodos() {
    let todos;
    if(localStorage.getItem("todos") === null) {
        todos = [];
    } else {
        todos = JSON.parse(localStorage.getItem("todos"));
    }
    todos.forEach(function(todo) {
        const todoDiv = document.createElement("div");
        todoDiv.classList.add("todo");
        const newTodo = document.createElement("li");
        newTodo.innerText = todo;
        newTodo.classList.add("todo-item");
        todoDiv.appendChild(newTodo);


        const completedButton = document.createElement("button");
        completedButton.innerHTML = '<i class="fas fa-check-circle"></li>';
        completedButton.classList.add("complete-btn");
        todoDiv.appendChild(completedButton);


        const trashButton = document.createElement("button");
        trashButton.innerHTML = '<i class="fas fa-trash"></li>';
        trashButton.classList.add("trash-btn");
        todoDiv.appendChild(trashButton);


        todoList.appendChild(todoDiv);
    });
}


function removeLocalTodos(todo) {
    let todos;
    if(localStorage.getItem("todos") === null) {
        todos = [];
    } else {
        todos = JSON.parse(localStorage.getItem("todos"));
    }



  deleteAllTodos.addEventListener("click", removeAllTodos);



    const todoIndex = todo.children[0].innerText;
    todos.splice(todos.indexOf(todoIndex), 1);
    localStorage.setItem("todos", JSON.stringify(todos));
}
HTML, Webseite, CSS, JavaScript, HTML5, Code, Programmiersprache, Webentwicklung, Frontend
1 Antwort

Meistgelesene Fragen zum Thema Webseite
Mehr meistgelesene Fragen zu Webseite