使用選擇更改img src

Question

我正在使用選擇表單來瀏覽頁面。

<form name="form">
  <select name="menu1"  onChange="MM_jumpMenu('parent',this,1)">
<option value="#" selected>SELECT</option> 
<option value="#a">location A</option>
<option value="#b">location B</option> 
</form>

我希望選擇表單具有更改圖像src的附加功能。 就像是：

<option value="#a; imagea.src='a2.jpg">location A</option>

謝謝。

Answer 1

MM_jumpMenu()可能是Macromedia的一件大事。 如果不是不可能的話，對其進行修改將很困難。 另一個問題是MM_jumpMenu()似乎取決於該value是否為錨。 將其他信息引入value屬性后， MM_jumpMenu()可能會停止工作。

考慮到所有這些，我建議劫持<option>標記上的另一個屬性並編寫自己的新函數：

<form name="form">
    <select name="menu1"
        onchange="MM_jumpMenu('parent',this,1);changeImageSrc(this);">
    <option value="#" selected>SELECT</option> 
    <option id="a2" value="#a">location A</option>
    <option id="b2" value="#b">location B</option> 
</form>
<script type="text/javascript">
function changeImageSrc(sel) {
    var opt = sel.options[sel.selectedIndex];
    if (opt.id) {
        var img = document.getElementById('yourImageId');
        img.src = opt.id + '.jpg';
    }        
}
</script>

Answer 2

您需要修改MM_jumpMenu函數。 請發布該功能的來源。

Answer 3

MM_jumpMenu是Dreamweaver函數。 您可能不想去那里。 除此之外，在value屬性中聚集一堆東西的味道很難聞。 做這樣的事情-

<img id="my-image" src="img/default.gif" />

<form name="form">
<select name="menu1" 
    onchange="MM_jumpMenu('parent',this,1); updateImage('my-image', this)">
<option value="#" selected>SELECT</option> 
<option value="#a">location A</option>
<option value="#b">location B</option> 
</form>

<script type="text/javascript">
updateImage = function(imageId, select) {
    var images = {
        a: 'img/a.gif',
        b: 'img/b.gif'
    }
    var key = select.value.substr(1);
    if (typeof images[key] != 'undefined') {
        document.getElementById(imageId).src = images[key];
    }
};
</script>