Avatar billede nicolailissau Nybegynder
26. marts 2010 - 14:23 Der er 14 kommentarer og
1 løsning

Fejlmelding ved JSON

Hej Eksperter.

Dette script virker i Chrome men ikke i IE eller FF.

Jeg tror måske jeg har en eller anden syntax fejl, for alle browserne kan sagtens læse JSON array'et. (Derfor jeg har sat det lille loop ind der alerter arrayet).

Jeg er forholdsvis ny til JSON og ved godt at det her script måske er lidt overkill til en simpel menu bar, men havde lige en mulighed for at få det testet.

Håber i kan hjælpe mig.

se det her: http://www.lissau.org/eksperten/eksperten.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function menuItem(){
    var BodyObject = document.getElementById("menuContainer");
    var menuPics = {"pics": [
        {"name": "forside", "width": "61px", "offset": "51px"},
        {"name": "services", "width": "68px", "offset": "56px"},
        {"name": "kontakt", "width": "67px", "offset": "66px"},
        {"name": "priser", "width": "49px", "offset": "0px"}
        ]
    };
   
    for(var i=0; i<=4;i++){alert(menuPics.pics[i].name)};
   
    for(var i=0; i<=4;i++) {
        var obj = "";
        var obj = document.createElement('div');
        obj.style.backgroundImage="url(menu_"+menuPics.pics[i].name+".png)";
        obj.style.backgroundRepeat="no-repeat";
        obj.style.width=menuPics.pics[i].width;
        obj.style.float="left";
        obj.style.marginRight=menuPics.pics[i].offset;
        obj.style.height="11px";
        obj.setAttribute('id', i);
        BodyObject.appendChild(obj);
    }
    var clear = document.createElement('div');
    clear.style.width="0px";
    clear.style.height="0px";
    clear.style.clear="both";
    BodyObject.appendChild(clear);
}
</script>
<style type="text/css">
#menu{
    background:#496067;
    width:980px;
    height:38px;
}
#menuContainer {
    padding:14px 50px 0px 40px;
}
</style>
</head>

<body onload="menuItem();">
<div id="menu">
        <div id="menuContainer">
        </div>
    </div>
</body>
</html>
Avatar billede softspot Forsker
26. marts 2010 - 14:35 #1
Det eneste der lige springer i mine øjne når jeg kigger ned gennem koden er din dobbelt-erklæring af obj inde i for-løkken:

for(var i=0; i<=4;i++) {
  var obj = "";
  var obj = document.createElement('div');

Det er givetvis ikke det, men i mangel på bedre forslag :-)
Avatar billede nicolailissau Nybegynder
26. marts 2010 - 14:49 #2
Tak for kommentar, men det er desværre ikke det. Jeg sætter obj lig nul for at være sikker på der ikke bliver hævet gammel data med når der laves en ny div.
Avatar billede softspot Forsker
26. marts 2010 - 14:54 #3
En anden ting som jeg lige får øje på er at dine løkker kører én for langt. Du itererer 5 gange over et array som kun indeholder 4 elementer. Kan det være det der er galt så?

for(var i=0; i<=4;i++) {

burde vel i stedet være

for(var i=0; i<menuPics.pics.length;i++) {
Avatar billede intenz Novice
26. marts 2010 - 16:32 #4
Som #3 skriver er det højst sandsynligt det der er fejlen.
Du prøver at hente et object ud som ikke eksisterer (i din 5. iteration). Husk den starter fra 0, så den skal være i<4, for kun at køre 4 gange.

Du kan med fordel bruge: menuPics.pics.length
Den giver også 4, men så slipper for at rette i koden hvis du tilføjer en 5.
Avatar billede nicolailissau Nybegynder
26. marts 2010 - 20:13 #5
Tak for kommentar.

Det løste fejlen! (delvist). Sammen med at det i JS DOM hedder cssFloat og ikke  float, virker det i Chrome og FF nu.

Men.. IE.. Virker stadig ikke. Har i nogle bud på hvad det kan være der påvirker IE?

Mvh
Avatar billede Slettet bruger
26. marts 2010 - 20:42 #6
Prøv med en errorhandler
- altid en god idé, men man glemmer det igen når problemet er løst : )

<head><script>
function errorHandler(desc,page,line)
  {
  alert('JavaScript fejl: '
      +'\nDesc: '+desc
      +'\nPage: '+page
      +'\nLine: '+line
      )
  return true
  }
window.onerror = errorHandler
</script></head>
Avatar billede nicolailissau Nybegynder
27. marts 2010 - 00:02 #7
Hey.. Siger bare det samme som FF fejlkonsol : "menuPics" is undefined..

Hvilket jeg ikke rigtig ved hvad jeg skal gøre ved, når man sagtens kan udskrive alert(menuPics.pics[3].name) eksempelvis..
Avatar billede Slettet bruger
27. marts 2010 - 00:55 #8
Kan du poste den rettede kode, og indikere hvilken linje den dør på ?
Avatar billede olebole Juniormester
31. marts 2010 - 15:33 #9
<ole>

Du erklærer 'menuPics' som en lokal variabel inde i en funktion - og så kendes den jo kun dér:


function menuItem(){
    var BodyObject = document.getElementById("menuContainer");
    var menuPics = {"pics": [
        {"name": "forside", "width": "61px", "offset": "51px"},
        {"name": "services", "width": "68px", "offset": "56px"},
        {"name": "kontakt", "width": "67px", "offset": "66px"},
        {"name": "priser", "width": "49px", "offset": "0px"}
        ]
    };


Prøv i stedet dette:


var menuPics = null;
function menuItem(){
    var BodyObject = document.getElementById("menuContainer");
    menuPics = {"pics": [
        {"name": "forside", "width": "61px", "offset": "51px"},
        {"name": "services", "width": "68px", "offset": "56px"},
        {"name": "kontakt", "width": "67px", "offset": "66px"},
        {"name": "priser", "width": "49px", "offset": "0px"}
        ]
    };


/mvh
</bole>
Avatar billede olebole Juniormester
31. marts 2010 - 15:38 #10
Sorry, glem min forrige post! Jeg tog fejl af en Tuborg-klamme  :o|

Det er helt korrekt dine itereringer, den er gal med. Skriv i stedet:


    for(var i=0; i<menuPics.length;i++){alert(menuPics.pics[i].name)};
   
    for(var i=0; i<menuPics.length;i++) {



- og lidt mere effektiv (og bedre) kode:


    for(var i=0,j=menuPics.length; i<j; i++){alert(menuPics.pics[i].name)};
   
    for(var i=0,j=menuPics.length; i<j; i++) {

Avatar billede olebole Juniormester
31. marts 2010 - 15:43 #11
Jeg gætter ligesom softspot på, at det går galt ved i=4. Du kun har fire objekter i arrayet - nemlig nummer 0, 1, 2 og 3. Prøv evt.:


for(var i=0; i<=4;i++){alert(menuPics.pics[i] + " :: " + i)};



Så kan du se, hvor det går galt  =)
Avatar billede nicolailissau Nybegynder
31. marts 2010 - 22:12 #12
Hey, og tak!

Vil godt lige starte med at undskylde at jeg ikke har været aktiv på posten de sidste dage.

Men har løst problemet.

Mine itereringer var helt sikkert også galt, men vigtigst var at det i IE ikke hedder .style.float eller .style.cssFloat men i stedet .style.styleFloat, hvilket gjorde at den ikke registrerede float'et.

Igen tak for hjælpen. Venligst lig svar :)
Avatar billede olebole Juniormester
05. april 2010 - 18:11 #13
Jeg springer over - ellers tak  =)
Avatar billede nicolailissau Nybegynder
08. april 2010 - 23:50 #14
Er der nogen der vil have nogle point? :)
Avatar billede nicolailissau Nybegynder
17. august 2010 - 13:12 #15
Afslutter.
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