Suunnitelussa on nettisivu paikalliseen käyttöön ja omalle koneelle. Sivulle olisi tarkoitus laittaa osoiteet nettisivuhin, joita tulee haettua useimmin, esimerkiksi sää ja hesari tms.
Sivuja olisi tarkoitus vähän ryhmitellä pudotusvalikkoihin. Tekoäly ehdotti suunnilleen tällaista html-sivua javascriptin kanssa
<!DOCTYPE html>
<html lang="fi">
<head>
<meta charset="UTF-8">
<title>Tekstialue ja Valikot</title>
<style>
body {
font-family: 'Helvetica Neue', Arial, sans-serif; /* Use a common sans-serif font */
font-size: 16px;
line-height: 1.6;
}
.container {
display: flex; /* Use flexbox for horizontal layout */
width: 80%;
margin: 20px auto; /* Center the container */
}
.dropdown {
margin-right: 20px; /* Add space between dropdowns */
flex: 1; /* Let dropdowns take equal width */
}
textarea {
width: 100%;
height: 150px; /* Increased height for better usability */
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
margin-top: 20px; /* Add space below dropdowns */
resize: vertical;
}
select {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
box-sizing: border-box;
}
</style>
</head>
<body>
<div class="container">
<div class="dropdown">
<label for="valikko1">Valikko 1:</label>
<select id="valikko1">
<option value="vaihtoehto1">Vaihtoehto 1</option>
<option value="vaihtoehto2">Vaihtoehto 2</option>
<option value="vaihtoehto3">Vaihtoehto 3</option>
<option value="vaihtoehto4">Vaihtoehto 4</option>
</select>
</div>
<div class="dropdown">
<label for="valikko2">Valikko 2:</label>
<select id="valikko2">
<option value="linkki1">Linkki 1</option>
<option value="https://hs.fi ">Linkki 2 </option>
<option value="linkki3">Linkki 3</option>
<option value="linkki4">Linkki 4</option>
</select>
</div>
<div class="dropdown">
<label for="valikko3">Valikko 3:</label>
<select id="valikko3">
<option value="kohde1">Kohde 1</option>
<option value="kohde2">Kohde 2</option>
<option value="kohde3">Kohde 3</option>
<option value="kohde4">Kohde 4</option>
</select>
</div>
</div>
<textarea id="tekstialue" placeholder="Kirjoita tekstiä tähän..."></textarea>
<script>
const valikko2 = document.getElementById('valikko2');
valikko2.addEventListener('change', () =>
{
const selectedOption = valikko2.options[valikko2.selectedIndex];
window.open(selectedOption.value, '');
}
);
</script>
</body>
</html>
Mutta ongelmana on, että valikko 2 -pudotusvalikossa linkki 2 avautuu vain satunnaisesti. Siitä pääsee hesarin sivulle vain silloin, jos selaimen hakukentässä napsauttaa tämän kokeilusivun osoitteen enterillä. Sivun uudelleen lataus selaimen latauspainikkeesta ei mahdollista hesarin sivun avaamista eikä hesarin sivua voi aata enää uudestaan, jos se on jo kerran suljettu. Pitää mennä selaimen osoitekenttään napsauttamaan enterillä kokeilusivu uudestaan haettavaksi.
Miten saisi linkin toimimaan aina, kun se on vain näkyvissä valikossa?
Aihe: [ ratkaistu ] Selaimen linkki toimii vain "satunnaisesti" omalla sivulla (Luettu 1922 kertaa)
