Login Text "ANMELDEN" und "ABMELDEN" mit Javascript

Status
Für weitere Antworten geschlossen.

Sahbanhha

Newbie
Registriert
Apr. 2021
Beiträge
3
Hallo Leute,
ich habe eine Webseite erstellt und ein loginsystem. Wenn ich mich jetzt anmelde soll bei dem anmelde Button automatisch abmelden stehen und wenn ich mich dann wieder abmelde automatisch anmelden stehen. Ich weiß das ich einfach 2 seiten mit anmelden und abmelden erstellen kann, aber das würde ich jetzt unbedingt nicht tun. Also meine Frage, kann man das mit java script automatisch machen das sich der Text dann ändert, vielleicht mit variablen.
Ich hoffe ihr habt verstanden was ich meine und hoffe ihr könnt mir weiter helfen.
MfG
 
Wie, mit JavaScript?
Das Login-System sollte nicht primär im Browser laufen, sondern auf deinem Server. Oder meinst du mit Node.JS?
 
Sahbanhha schrieb:
Ich hoffe ihr habt verstanden was ich meine und hoffe ihr könnt mir weiter helfen.
Bloß nicht online stellen was auch immer du da tust. Als Übung ok, aber nicht. online. stellen.
So mache ich das in dem MVC-Framework, das selbstredend benutzt wird, mit dem Authentifizierungs-Plugin, das selbstredend benutzt wird:
Code:
<% if user_signed_in? %>
  <%= link_to "Abmelden", logout_path %>
<% else %>
  <%= link_to "Anmelden", login_path %>
<% end %>
Sowas schreibt man nicht selber, selbstredend.
 
  • Gefällt mir
Reaktionen: pcBauer
Ja ist nur für eine Übung, habe auch nicht so viel Erfahrung mit sowas. Danke für die Antworten
Ergänzung ()

Bin auch erst in der 8. Klasse. Wir müssen im Fach Informatik, eine Webseite erstellen. Da der Lehrer viel zu tun hat, hat er gesagt sollen wir und dürfen wir im Internet auch recherchieren. Könnte mir dann jemand helfen oder sagen wie man das macht.
Ergänzung ()

Ihr könntet mir auch ein Youtube Video vorschlagen, dass würde mir auch sehr helfen.

Zur not erstelle ich einfach 2 seiten mit an- und abmelden, ist zwar unprofessionell und meiner Meinung nach blöd. Wenn ihr wollt kann ich euch auch noch meinen Quellcode schicken.
Ich habe auf der Seite https://www.html-seminar.de/forum/thread/9853-login-text-anmelden-und-abmelden/ auch schon angefragt, aber keiner wollte mir antworten, weil sie denken das sind Hausaufgaben. Ich hoffe ihr könnt mir helfen. Bitte 👏
 
Zuletzt bearbeitet:
  • Gefällt mir
Reaktionen: BeBur
Ah ok, das ist was anderes 👍.
Du solltest hier am besten zeigen, was du schon gemacht hast oder wo du gerade stehst. Was passiert, wenn sich ein Benutzer anmeldet? Genau das musst du dann auch abfragen mit z.B. Javascript.

Ohne Eigenleistung wird der Thread sonst hier vermutlich alsbald dicht gemacht.
 
HTML:
<!DOCTYPE html>
<html lang="en">
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Login</title>
    <link rel="shortcut icon" type="image/x-icon" href="Bilder/osterreich.png"/>
    <link rel="stylesheet" href="CSS/login.css">
    <script src="test.js"></script>
<body>
 <img src="Bilder/Logo login.svg" class="logo">

    <div class="loginbox">
      <img src="Bilder/Login_icon-removebg-preview.png" class="avatar"> 
        <h1>Melde dich hier an</h1>
            <p>Benutzername</p>
            <input autocomplete="off" type="text" name="" placeholder="Benutzernamen eingeben" id="username">
            <p>Passwort</p>
            <input type="password" name="" placeholder="Passwort eingeben" id="password">
       <input type="submit" name="" value="Anmelden" onclick="validate()">
       <a href="#">Passwort vergessen?</a><br>
       <a href="index.html">Weiter ohne anmelden</a>       
    </div>

 
</body>
</html>
Ergänzung ()

Javascript:
function validate()
{
var username=document.getElementById("username").value   
var password=document.getElementById("password").value
if(username=="admin" && password=="1")
{
   location.replace('https://theia.wittekind.de/gruppe01web/index2.html')
}
else
{
    alert(unescape("Bitte geben Sie g%FCltige Daten ein"));
}

}

Das ist meine Index.html

HTML:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Home</title>
    <link rel="shortcut icon" type="image/x-icon" href="Bilder/osterreich.png"/>
    <link rel="stylesheet" href="CSS/Home_style.css">
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Reggae+One&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>

<div class="topline">
    <div class="logo">
        <img src="Bilder/UntitledLOGO_animated (3).svg">
    </div>
    <div class="konto">
        <a href="index.html"><i class="fa fa-user"></i>Abmelden</a>
    </div>
</div>
    <div class="menu-bar">
        <ul>
            <li><a href="index2.html">Home</a></li>
            <li><a href="aktivitaeten.html">Aktivitäten</a>
                <div class="dropdown">
                    <ul>
                        <li><a href="attersee.html">Attersee</a></li>
                        <li><a href="wien.html">Wien</a></li>
                        <li><a href="soelden.html">Sölden</a></li>
                    </ul>
                </div>
            </li>
            <li><a href="#">Produkte</a></li>
            <li><a href="Über uns.html">Über uns</a></li>
        </ul>
    </div>

<div class="header">
 <div class="container">   
   <div class="row">
       <div class="col-2">
           <h1>Brauchst du Freiheit</h1>
           <p>dann komm nach Österreich dem Reich der Öster</p>
           <a href="" class="btn">Erkunde es jetzt</a>
        </div>
       <div class="col-2">
            <img src="Bilder/hallstatt-3609863_1920.jpg">
       </div>
   </div>
 </div>   
</div>
</body>
</html>
Ergänzung ()

Ist das so Übersichtlich oder soll ich noch etwas ändern?
 
Zuletzt bearbeitet:
Status
Für weitere Antworten geschlossen.
Zurück
Oben