Umleitung nach der Auswahl einer Option im Auswahl -Tag ⇐ HTML

[Anonymous]

Ich bringe Ihnen eine Frage zu einem Tag Ich arbeite für eine Website. Ich glaube, dass der Code, den ich hier schreibe, in Ordnung sein sollte, aber wenn man bedenkt, dass ich bei JS ziemlich neu bin (ich kenne hauptsächlich die Grundlagen von HTML und CSS, obwohl es eine Weile her ist, seit ich mit Front-End-Webdesign gearbeitet habe: P). Es ist nicht überraschend, dass es nicht funktioniert. In der Sprache, die Sie ausgewählt haben. Mein Versuch mit dem kleinen Wissen, das ich habe, war es, die Informationen des Select -Tags zu erhalten und den Wert in die Var -Richtung zu rufen.

Code: Select all

[*]




Website




[list]

[url=basic_en.html]Home[/url][/h4]

[*]
[h4][url=#]CV[/url][/h4]

[*]
[h4][url=#]Contact[/url][/h4]

[*]

EN
ES
FR


[/list]
[list]
[*]
[h4][url=basic_en.html]Name Surname[/url][/h4]

[*]
[h4][url=#]CV[/url][/h4]

[*]
[h4][url=#]Contact[/url][/h4]

[*]

EN
ES
FR


[*]


menu



[/list]

Das CSS, den Dokumentstil.css :

Code: Select all

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}
.header{
color: white;
width: 100%;
}
nav{
background-color: black;
width: 100%;
height: 6.5rem;
position: fixed;
z-index: 68;
}
.nav{
display:flex;
justify-content: flex-end;
align-items: center;
width: 100%;
}
.item-nav{
list-style: none;
margin-right: 2rem;
font-size: 1.25rem;
}
.item-nav a{
text-decoration: none;
color: white;
}
.item-nav:first-child{
margin-right: auto;
margin-left: 2rem;
font-size: 4rem;
}
.sidebar{
position: fixed;
top: 0;
right: 0;
height: 100dvh;
height: 100vh;
width: 180px;
z-index: 69;
background-color: black;
color: white;
display: none;
flex-direction: column;
align-items: flex-start;
justify-content: flex-start;
gap: 1rem;
float: right;
padding: 1rem;
}
.sidebar ul{
width: auto;
}
.menu-btn{
display: none;
}
.select-container{
position: relative;
width: 2rem;
}
#lang-box{
border: none;
appearance: none;
width: 100%;
color: white;
background-color: black;
cursor: pointer;
font-family: Cabin;
font-size: 1.25rem;
}
.item-lang{
background-color: black;
border-radius: 0;
}
@media only screen and (max-width: 930px){
.hide-maxwidth{
display: none;
}
.menu-btn{
display: block;
}
}

und die kleinen JS, die an app.js :
beteiligt sind/* Here is where I tried the redirection */
function changeLang(){
var select = document.getElementById('lang-box');
var direction = select.options[select.selectedIndex].value;
window.location.href = direction;
}
/* Functionality of sidebar (and yes, I know it does not close when the viewport is too big, I am working on it hahaha)*/
function showSidebar(){
const sidebar = document.querySelector('.sidebar');
sidebar.style.display = 'flex';
}
function hideSidebar(){
const sidebar = document.querySelector('.sidebar');
sidebar.style.display = 'none';
}
< /code>
Wenn Sie mir angeben könnten, was so gut ist, und weitere Ratschläge, um JS (oder auch in CSS) zu verbessern, würde ich es sehr zu schätzen wissen. Danke im Voraus