附加值选项，如宽度和高度

问题描述：

我有选择菜单。每个选项都会切换显示的图像。我在问如何将每个选项的每个唯一宽度和高度翻译成实际显示的图像。据我所知，宽度和高度是没有根据的，只要它们对选项标签有影响，但我想我的意思是我想要一个与每个选项相关联的值并绑定到每个选项上，并在选项附加时影响图像被选中。像添加一个变量，如 var c = a.getElementByTagName（'class'）。getAttributeNode（'width'）。value; ??附加值选项，如宽度和高度

我真的不知道。我如何将值与选项相关联？最好有一种方法，不需要为每个选项附加新的课程。我的代码到目前为止只能改变src。

我希望你能理解这个问题。我尽我所能解释它。谢谢你的帮助。

<!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>

答

用途：

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

这应该给你所选择的选项的宽度和高度，就像你现在让他们嵌入在每个标签。希望这可以帮助！

附加值选项，如宽度和高度

相关推荐