Avatar billede elskermad.dk Nybegynder
23. december 2007 - 12:09 Der er 9 kommentarer og
1 løsning

onMouseOver i suggest-felt

Hej Eksperter!

Jeg er i gang med at lave en (Google)suggest-funktion.
Men jeg har problemer med min mouseover-farveskift.

Lige meget hvad jeg gør, så er det altid det nederste forslag som bliver farvet:

function lookup(felt) {
    var xmlhttp;
   
    if (window.XMLHttpRequest) {
        xmlhttp = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) {
        xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
    }
   
    navn = document.getElementById('navn_' + felt).value;
   
    xmlhttp.open('GET','lookup.php?navn=' + navn,true);
   
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4) {
            var result = xmlhttp.responseText;
           
            var json = eval('(' + result + ')'); // min json ser således ud: ["test 1","test 2","test 3","test 4", ... ,"test n"]
   
            document.getElementById('navn_' + felt).style['backgroundColor']    = '#EAEAEA';
            document.getElementById('suggest_' + felt).style['display']            = 'block';
           
            for(i=0;i<json.length;i++) {
                var suggest = document.createElement('div');
               
                suggest.id = 'suggest_' + felt + '_' + i;
               
                suggest.style['padding']        = '2px';
               
                if (suggest.addEventListener)    suggest.addEventListener('mouseover',function(e) { var func = mouseover(suggest.id);    if (!func) { if (e && e.preventDefault) e.preventDefault();    } return func; },false);
                else if (suggest.attachEvent)    suggest.attachEvent('onmouseover',function(e) { var func = mouseover(suggest.id);    if (!func) { if (e && e.preventDefault) e.preventDefault();    } return func; } );
               
                navn = json[i];
               
                suggest.appendChild(document.createTextNode(navn));
               
                document.getElementById('suggest_' + felt).appendChild(suggest);
            }
        }
    }
   
    xmlhttp.send(null);
}
Avatar billede elskermad.dk Nybegynder
23. december 2007 - 12:10 #1
min mouseoverfunktion ser således ud:

function mouseover(felt) {
    document.getElementById(felt).style['backgroundColor'] = '#CCCCCC';
}
Avatar billede elskermad.dk Nybegynder
23. december 2007 - 12:11 #2
kan ses her:
http://epostbud.dk/album/

(klik på røven for at få et tekstfelt frem)
Avatar billede elskermad.dk Nybegynder
23. december 2007 - 12:12 #3
skal siges at den endnu kun virker i IE!
Avatar billede elskermad.dk Nybegynder
23. december 2007 - 12:20 #4
jeg har forsøgt mig i funktionkaldet af mouseover at bruge this.id i stedet for suggest.id, men det giver fejl
Avatar billede elskermad.dk Nybegynder
23. december 2007 - 15:55 #5
det ser ud til at man i IE kan lave et hack ved at sætte en timeout således den først bliver tilføjet elementet efter alle er blevet oprettet!

kan dette være rigtigt det er nødvendigt? og hvad med firefox?
Avatar billede roenving Novice
25. december 2007 - 00:44 #6
Hvorfor ikke bare:

                if (suggest.addEventListener)    suggest.addEventListener('mouseover',function(e) { mouseover(this); },false);
                else if (suggest.attachEvent)    suggest.attachEvent('onmouseover',function(e) { mouseover(this); } return func; } );

-- og tilsvarende i mouseoveren:

function mouseover(felt) {
    felt.style.backgroundColor = '#ccc';
}
Avatar billede roenving Novice
25. december 2007 - 00:46 #7
Hov ...

                if (suggest.addEventListener)    suggest.addEventListener('mouseover',function(e) { mouseover(this); },false);
                else if (suggest.attachEvent)    suggest.attachEvent('onmouseover',function(e) { mouseover(this); } );

-- og så skal du først sætte events på, når elementet er blevet indføjet i dom'en, altså efter:

                document.getElementById('suggest_' + felt).appendChild(suggest);

!-)
Avatar billede elskermad.dk Nybegynder
25. december 2007 - 11:00 #8
men bliver this ikke opfattet som eventen og ikke elementet når man sætter det ind?
Avatar billede roenving Novice
25. december 2007 - 14:01 #9
Mmmm, måske, men så kan du bare fjerne det andet, så vil den først udføre koden, når eventen forekommer, og så kan der ikke tages fejl:

                if (suggest.addEventListener)    suggest.addEventListener('mouseover','mouseover(this);',false);
                else if (suggest.attachEvent)    suggest.attachEvent('onmouseover','mouseover(this);');
Avatar billede elskermad.dk Nybegynder
08. december 2009 - 18:07 #10
luk
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