CIO Tech Eksperten IT-JOB IT-Kurser Events Podcast Søg

Log ind eller opret profil

Du kan også logge ind via nedenstående tjenester

thomasfricke Juniormester

06. september 2018 - 02:26 Der er 9 kommentarer og
1 løsning

onClick (Ændre css på div, der er efter onClick)

<div id="btn" onclick="showText();">Klik her</div>
<div id="infoText" style="display: none;">Besked vises</div>

<script>
function showText(){
******
}
</script>

### Function showText() ###
Hvordan for jeg function til at ændre style på id="infoText" til display: block; ???

--- Noget i stil med $("#btn").div.after.change.css (display : block;) ---

Synes godt om

Rune1983 Ekspert

06. september 2018 - 07:28 #1

Synes godt om

Slater Ekspert

06. september 2018 - 07:57 #2

Eller når du alligevel åbenbart bruger jQuery:

$('#btn').click(function() {
$('#infoText').show();
});

Synes godt om

thomasfricke Juniormester

06. september 2018 - 09:28 #3

Vil det ikke ændre ALLE der hedder #infoText ???

Synes godt om

Rune1983 Ekspert

06. september 2018 - 09:33 #4

Det er vist ikke så godt at have flere med samme id.
Så skal de adskilles fra hinanden.
Fx.
<script>
function showText(x)
{
document.getElementById(x).style.display = "block";
}
</script>
<div id="btn" onclick="showText('infoText01');">Klik her</div>
<div id="infoText01" style="display: none;">Besked vises</div>
<div id="btn" onclick="showText('infoText02');">Klik her</div>
<div id="infoText02" style="display: none;">Besked vises</div>
<div id="btn" onclick="showText('infoText03');">Klik her</div>
<div id="infoText03" style="display: none;">Besked vises</div>

Synes godt om

1 synes godt om dette

thomasfricke Juniormester

06. september 2018 - 09:47 #5

derfor jeg søgte noget i stil med " .div.after "

Synes godt om

Rune1983 Ekspert

06. september 2018 - 12:55 #6

Prøv lige dette eksempel af og se om det ikke kan tilpasset dit kode.

<div style="width: 100%;">
<style>
.hidden>div {
display:none;
}

.visible>div {
display:block;
}
</style>
<div style="width: 100%;" class="text_container">
<h3>Nummer 1</h3>
<div>
<p>Nummer 1 tekst</p>
</div>
</div>
<div style="width: 100%;" class="text_container">
<h3>Nummer 2</h3>
<div>
<p>Nummer 2 tekst</p>
</div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('.text_container').addClass("hidden");

$('.text_container').click(function() {
var $this = $(this);

if ($this.hasClass("hidden")) {
$(this).removeClass("hidden").addClass("visible");

} else {
$(this).removeClass("visible").addClass("hidden");
}
});
});
</script>
</div>

Synes godt om

Slater Ekspert

06. september 2018 - 13:16 #7

Eller nemmere med jQuery:

<div class="btn" onclick="showText();">Klik her</div>
<div class="infoText" style="display: none;">Besked vises</div>

$('.btn').click(function() {
$(this).find('+ .infoText').toggle();
});

Synes godt om

Slater Ekspert

06. september 2018 - 13:17 #8

Hov, onclick skal bare fjernes.

Synes godt om

Rune1983 Ekspert

06. september 2018 - 14:25 #9

For at mit eksempel ovenfor virker skal følgende være i header
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</head>

Synes godt om

thomasfricke Juniormester

08. september 2018 - 08:45 #10

Det blev Rune's med forskellige id...

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Sæt vindue størrelse Af poulmadsen i JavaScript	1	08/10/202417:18	13/10/202412:33
Opgavestyring Af ingeman i JavaScript	1	15/09/202416:06	15/09/202420:40
Returner ikke alt Af ingeman i JavaScript	13	26/06/202414:40	01/07/202417:00
Vis og skjul sektioner - virker kun på den første sektion Af nemlig i JavaScript	4	24/06/202422:50	26/06/202420:33
Hente og gemme Cookies like this. Af DanishBear i JavaScript	6	04/06/202416:23	05/06/202414:23

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS