2017-10-16 20 views
0

J'ai un menu Sélectionner. Chaque option change l'image affichée. Je demande comment je traduis sur la largeur et la hauteur uniques liées à chaque option sur l'image affichée. Je comprends que la largeur et la hauteur sont sans fondement dans la mesure où elles agissent sur une étiquette d'option mais je suppose que je veux dire que je veux une valeur associée et liée à chaque option qui entrent en jeu et affecte l'image quand l'option est attachée à est sélectionné. Quelque chose comme ajouter une variable comme var c = a.getElementByTagName ('class'). GetAttributeNode ('width'). Value; ??Ajout de valeurs à des options telles que Largeur et Hauteur

Je ne sais vraiment pas. Comment associer des valeurs aux options? De préférence il y a un moyen sans attacher une nouvelle classe à chaque option. Mon code jusqu'à présent ne peut que changer le src.

J'espère que vous comprenez la question. Je l'ai expliqué de mon mieux. Merci pour toute aide.

<!DOCTYPE html> 
<html> 
<body> 

<select id='select1'> 
    <option value='pic_unavail' selected width='300' height='300'>-- Choose --</option> 
    <outgroup label="Animals"> 
    <option value='pic_monkey' id='monkey' width='50' height='100'>Monkey</option> 
    <option value="pic_cat" id='cat' width='100' height='200'>Cat</option> 
    <option value="pic_dog" id='dog' width='200' height='250'>Dog</option> 
    </outgroup> 
</select> 

<img id="pic"> 

<script type="text/javascript"> 

document.getElementById("select1").onchange = select; 

var a = document.getElementById('select1')  
var b = document.getElementById('pic'); 


function select() { 
    b.src = this.value; 
    return 
}  

</script> 
</body> 
</html> 

Répondre

1

Utilisation:

this.options[this.selectedIndex].getAttribute('width'); 
this.options[this.selectedIndex].getAttribute('height'); 

Cela devrait vous donner juste la largeur option sélectionnée et la hauteur que vous avez actuellement les intégrés dans chaque balise. J'espère que cela t'aides!