0

所以,我拼凑了一些教程来做到这一点,我已经搜索了几个小时,但还没有找到一个例子,或者如果它可能单独使用 JavaScript。

目前,图像会根据选择的“onchange”选项进行更改。我希望数组中的图像显示在下拉列表中而不是文本中。

仅针对此问题的精简版本。选择选项 1,图像将随零件编号一起更改。

<script type='text/javascript'>

var numeric = [
    ['menu name',
        'http://www.w3schools.com/images/w3html.gif',
        'part #',
        'http://www.w3schools.com/'],

    ['input2-0',
        'input2-1',
        'input2-2',
        'input2-3'],

    ['input3-0',
        'input3-1',
        'input3-2',
        'input3-3'],

    ['input4-0',
        'input4-1',
        'input4-2',
        'input4-3']

];





window.onload = function () {



    document.getElementById("img1").src = numeric[3][1];
    document.getElementById('id_link1').firstChild.data = numeric[3][2];
    document.getElementById('id_link1').href = numeric[3][3];
    document.myForm.req_one.options[0] = new Option(["Please Choose"], 0);


    var i = 0;
    for (var i = 0; i < numeric.length; i++) {
        var k = i + 1;

        document.myForm.req_one.options[k] = new Option(numeric[i][0], k);

    }


}



function pic1() {

    var x = document.forms["myForm"]["req_one"].value;
    x = x - 1;
    alert(x + ". " + numeric[x][1]);


    document.getElementById("img1").src = numeric[x][1];
    img1.height = 75;
    img1.width = 75;
    document.getElementById('id_link1').firstChild.data = numeric[x][2];
    document.getElementById('id_link1').href = numeric[x][3];

}

</script>

<form name="myForm">Select populated onload via Array
    <br>
    <select name="req_one" onchange="pic1()"></select>
</form>
<br>
<div>
    <img src="" id="img1" border="0" />
</div>

谢谢

4

0 回答 0