Avatar billede thadoews Nybegynder
16. februar 2014 - 10:17 Der er 14 kommentarer og
1 løsning

Vise indhold i DIV afhængig af hvilket link der klikkes på.

Hej eksperter

På min side, http://simonhollander.dk/v/cash.shtml, ønsker jeg at de 5 links under navnet, Volstrups Cash, skal afhængig af hvad der klikkes på, vise forskelligt indhold i DIV'en lige nedenunder.

Jeg har fundet et lækkert jQuery-script,som jeg har forsøgt at gøre brug af, men jeg kan simpelthen ikke få det til at spille.

Her er det script jeg har:

<script type="text/javascript">
$('#om').click(function(e) {
    $('.hestetekst').load('heste/Volstrups Cash/html/cashtekst.html');
    e.preventDefault();
});

$('#resul').click(function(e) {
    $('.hestetekst').load('heste/Volstrups Cash/html/cashresul.html');
    e.preventDefault();
});

$('#billeder').click(function(e){
    $('.hestetekst').load('heste/Volstrups Cash/html/cashbilleder.html');
    e.preventDefault();
});

$('#video').click(function(e){
    $('.hestetekst').load('includes/cashvideo.html');
    e.preventDefault();
});

$('#afkom').click(function(e){
    $('.hestetekst').load('includes/cashafkom.html');
    e.preventDefault();
});
</script>


I de link, som skulle aktivere scriptet, bruger jeg ID, så det BURDE virke...
Hvad er det der går galt?
Avatar billede thadoews Nybegynder
16. februar 2014 - 10:25 #1
Originalscriptet fandt jeg på den her side:
http://codepen.io/johnmotyljr/pen/qhvue
Avatar billede jakobdo Ekspert
16. februar 2014 - 14:43 #2
Hvad med noget ala: http://jsfiddle.net/LnBwV/
Avatar billede HBP2 Praktikant
16. februar 2014 - 18:59 #3
Mon problemet ikke er at du kalder
  $('#...').click()
inden resten af siden er indlæst?

Prøv at bruge:
  $(function() {
      // indsæt din eksisterende javascript her
  });
Avatar billede thadoews Nybegynder
16. februar 2014 - 20:11 #4
@HBP2,  hvordan får jeg så fortalt scriptet ved hvilket ID den skal aktivere ved?
Jeg er ikke så skrap til Javascript, og jeg er lidt usikker på hvad du egentligt mener.....

@Jakobdo, det jeg gerne vil have er en HTML-fil der bliver sat ind og ikke kun en kort tekst...
Avatar billede jakobdo Ekspert
16. februar 2014 - 20:21 #5
HBP2: Mener din kode skal være sådan her:

<script type="text/javascript">
$(function(){
    $('#om').click(function(e) {
        $('.hestetekst').load('heste/Volstrups Cash/html/cashtekst.html');
        e.preventDefault();
    });

    $('#resul').click(function(e) {
        $('.hestetekst').load('heste/Volstrups Cash/html/cashresul.html');
        e.preventDefault();
    });

    $('#billeder').click(function(e){
        $('.hestetekst').load('heste/Volstrups Cash/html/cashbilleder.html');
        e.preventDefault();
    });

    $('#video').click(function(e){
        $('.hestetekst').load('includes/cashvideo.html');
        e.preventDefault();
    });

    $('#afkom').click(function(e){
        $('.hestetekst').load('includes/cashafkom.html');
        e.preventDefault();
    });
});
</script>
Avatar billede thadoews Nybegynder
16. februar 2014 - 21:32 #6
Hej igen Jakobdo.
Tak for dit svar, men jeg kan stadig ikke få det til at lykkedes!

Kan det være den her det er galt med, bare for at prøve nogen muligheder?
<script type="text/javascript" src="//code.jquery.com/jquery-1.10.2.min.js"></script>
Avatar billede jakobdo Ekspert
16. februar 2014 - 21:39 #7
Hvis du "kun" tester lokalt, kan det sagtens være problemet.
Så skriv lige http / https foran.
Avatar billede jakobdo Ekspert
16. februar 2014 - 21:48 #8
Jeg har netop lige testet dette:


<html>
<head>
<title>Test</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
$(function(){
  $('#afkom').click(function(e){
    alert("test");
    e.preventDefault();
    $('.hestetekst').load('test.html');

    $( ".hestetekst" ).load( "test.html", function() {
      alert( "Load was performed." );
    });
  });
});
</script>
</head>
<body>
  <a href="http://www.hest.dk" id="afkom">Test</a>
  <div class="hestetekst">Test</div>
</body>
</html>

Og dette er i test.html:
Heste information...

Da jeg testede den "lokalt" virkede den ikke.

Men smed jeg den "online" på en lokal apache, virkede den fint.
Avatar billede thadoews Nybegynder
24. februar 2014 - 12:15 #9
Hej igen Jakobdo!

Har lige måttet forlade nettet den sidste uges tid. Jeg har nu set på det og du har sq ret! Jeg er åbenbart kommet til ved henvisning til jQuery kun at skrive "//" i stedet for "https://". Det løste problemet! :)

Nu er der bare ét lille problem... Når jeg skifter fra linket "Om Cash" til "Resultater" og tilbage igen, så er alle æøå blevet til ruder med spørgsmålstegn... How to fix that? :S

I hvert fald synes jeg at du skal smide et svar!
Også tak til HBP2 for hjælpen :)
Avatar billede jakobdo Ekspert
24. februar 2014 - 15:46 #10
Du skal huske alle dine "koder/filer" skal gemmes som UTF-8.
Avatar billede thadoews Nybegynder
25. februar 2014 - 15:07 #11
Jeg vil gerne beholde ISO-8859-1 da det indeholder de danske bogstaver(og lidt ekstra) og jeg ved at der er en hel religion forbundet med valg af charset, så det behøves ikke blive diskuteret :)

Men hvordan gør jeg det i disse JavaScript-include-filer? Jeg kan forstå at det skal gøres i det dokument jeg henter in med JS, men hvordan kan Google ikke lige give et svar på...
Avatar billede jakobdo Ekspert
25. februar 2014 - 15:18 #12
utf-8 understøtter fint de danske tegn + mange mange flere...
Så overvej nu at lav din side rigtigt fra start.

Dette vil lappe din nuværende "DÅRLIGE" løsning. :o)

$.ajaxSetup({
    'beforeSend' : function(xhr) {
        xhr.overrideMimeType('text/html; charset=ISO-8859-1');
    },
});
Avatar billede thadoews Nybegynder
25. februar 2014 - 18:09 #13
Det virker bare super godt :) Jeg takker mange gange! Smid venligst et svar Jakobdo! ;)
Avatar billede jakobdo Ekspert
25. februar 2014 - 18:28 #14
Svar
Avatar billede jakobdo Ekspert
26. februar 2014 - 08:28 #15
Takker for point.
Avatar billede 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.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

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