28/07/14 19:01
LukeMilan
Dato questo codice:
<script>
window.onload = function WindowLoad(event) {
document.getElementById('result').onmouseover=function(){this.style.background='#eee'}
document.getElementById('result').onmouseout=function(){this.style.background='#fff'}
}
</script>
<div id="result">a</div>
<div id="result">b</div>
<div id="result">c</div>
Mi evidenzia al passaggio del mouse soltanto il primo elemento..perchè??
Ultima modifica effettuata da LukeMilan 28/07/14 19:17
aaa
29/07/14 7:34
Bonny
Devi usare il selettore di tipo
class:
<!DOCTYPE html>
<html>
<head></head>
<body>
<div class="result">a</div>
<div class="result">b</div>
<div class="result">c</div>
<script type="text/javascript">
function onMouseOver(){
this.style.background='#eee';
}
function onMouseOut(){
this.style.background='#fff';
}
window.onload = function WindowLoad(event) {
//prendo tutti gli elementi con class = result
var divs = document.getElementsByClassName('result');
//per ogni elemento
for(var i in divs){
//associo le mie funzioni agli eventi che mi interessano
divs[i].onmouseover = onMouseOver;
divs[i].onmouseout = onMouseOut;
}
}
</script>
</body>
</html>
perchè la funzione getElemetById(id) ritorna l'elemento con l'id specificato a differenza di getElementsByClassName (come vedi
Elements) ritorna tutti gli elementi della classe specificata.
Ultima modifica effettuata da Bonny 29/07/14 7:35
aaa
12/09/14 15:48
chiara91
Non è corretto avere più elementi con lo stesso id, dovresti usare le classi.
aaa
