如何声明图像数组并操作其变量的 src 值？

Question

我知道这很简单，但无论如何我都无法让它工作。我只是很难接受 jQuery 语法，甚至很难掌握如何处理变量和数组。有好心人帮我解决这个烂摊子吗？

// declaring array and setting same image source for all variables in it

var imgarray1 = ['html.(src="img0.jpg")', 'html.(src="img0.jpg")', 'html.(src="img0.jpg")'];


// when I click any image with class myimg, pass source of clicked image to imgarray1

$('img.myimg').click(function () {
('imgarray1').append(this)
});


// show second variable in array myimg as picture

$('imgarray1').html(src='idx=1');

为什么没有工作？ :(

Answer 1

看看this JSFIDDLE:

// declare the array
var imgarray1 = [];

// bind on click - select the image
$('img.myimg').click(function () {
    // insert image to array
    imgarray1.push(this.src);
});

// bind on click - show the "hand"
$('#showcards').on('click', function(){
    // loop through array elements
    imgarray1.forEach(function(src) {
        // add current element to the appropriate div
        $('#hand').append(
            $('<img/>', {src: src, width: 100})
        );
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="deck">
    <img class="myimg" src="http://www.vectortemplates.com/raster/batman-logo.gif" width="100"/>
    <img class="myimg" src="http://www.vectortemplates.com/raster/batman-logo-big.gif" width="100"/>
    <img class="myimg" src="http://1.bp.blogspot.com/-iWkJWpzsrw0/UxdyOspVimI/AAAAAAAAATw/zrMWxvkPbtg/s1600/Batman+Logo+%282%29.png" width="100"/>
    <img class="myimg" src="http://vignette1.wikia.nocookie.net/fictionalcrossover/images/c/ca/Batman_logo.png/revision/latest?cb=20131110212948" width="100"/>
</div>
<button id="showcards">Show Hand</button>
<div id="hand"></div>

我已经对代码进行了评论，因此这应该足以理解正在发生的事情 - 但如果有什么不清楚的地方，请告诉我。

如何声明图像数组并操作其变量的 src 值？

How to declare image array and manipulate src value of its variables?

arrays

variables

jquery

image