Question

我是男人为什么这个功能不起作用???

 $(document).ready(function () {

            $('form#slider img.img').click(function () {

                $('div#immagini img').attr('src', $(imgArray));

            });


        });

当我点击我的html图像时，我希望我的阵列图像显示屏幕。

HTML：

<form id="slider" onclick="show()">
            <img class="img" src="/images/simpson1.png"/><br>
            <img class="img" src="/images/simpson2.png"/><br>
            <img class="img" src="/images/simpson2.png"/><br>
        </form>

<div id="immagini">
        <img src="" />
    </div>

JS：

function show() {
        var imgArray = new Array();
        imgArray = new Image();
        /*-------------------------------*/
        imgArray[0] = "/images/Image1.png";
        imgArray[1] = "/images/Image2.png";
        imgArray[2] = "/images/Image3.png";

        var img = document.getElementById("slider").getElementsByClassName("img");

        switch(img)  
    {
        case 0: document.getElementById("immagini").getElementsByTagName('img')[0].src = imgArray[0]; break;
        case 1: document.getElementById("immagini").getElementsByTagName('img')[0].src = imgArray[1]; break;
        case 2: document.getElementById("immagini").getElementsByTagName('img')[0].src = imgArray[2]; break;

    }

感谢10000 !!

Answer 1

试试这个：

$(document).ready(function () {
        var imgArray = new Array();
        imgArray[0] = "/images/Image1.png";
        imgArray[1] = "/images/Image2.png";
        imgArray[2] = "/images/Image3.png";
            $('form#slider img.img').click(function(e) {
                var index = $(this).prevAll('img').length; // to get the length of prev images.
                $('div#immagini img').attr('src', imgArray[index]);
            });
});

<强> DEMO

Answer 2

你的代码中有很多东西乱七八糟。

show函数没有关闭花括号。
您正在直接从表单中调用onclick，这没有任何意义。

假设您要在div中使用id immagini为image标签的src属性设置一个图像。

我为您设置了以下代码。

http://jsbin.com/cotateju/1/

我建议你先了解你想要实现的目标。

或者，如果您只是想通过javascript加载三个图像，则不需要切换案例：您可以使用以下功能。

function show() {
        var imgArray = new Array();
        imgArray = new Image();
        /*-------------------------------*/
        imgArray[0] = "http://placehold.it/350x150&text=First Image";
        imgArray[1] = "http://placehold.it/350x150&text=Second Image";
        imgArray[2] = "http://placehold.it/350x150&text=Third Image";


         document.getElementById("immagini").getElementsByTagName('img')[0].src = imgArray[0]; 
         document.getElementById("immagini").getElementsByTagName('img')[1].src = imgArray[1]; 
         document.getElementById("immagini").getElementsByTagName('img')[2].src = imgArray[2];

                }

从我的阵列显示图像

2 个答案: