Javascript Splice数组值

Question

几天前，我问了一个问题，我会把它链接到这里，因为它对我想要做什么有一些解释，所以你可以知道我想做什么，JavaScript阵列拼接这个问题现在已经解决了，代码也很好，但是现在我想得到已经拼接的卡片的价值(当我们把它们拖到方框中并点击它们时得到的卡片)。

我以为这很简单，但我想我错了，

具体:我希望用户拿起3张卡，这将被邮寄到网站的所有者，现在我可以拿起3张卡，通过使用剪接，用户不能选择多个相同的卡，但现在我希望它捡起的卡，变成一个变量或什么东西，我可以邮寄他们以后。

$(function () {
var cars = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10"];
 var rand = cars[Math.floor(Math.random() * cars.length)];
$(".cards img").each(function (index) {
var src = cars.splice(Math.floor(Math.random() * cars.length), 1);
console.log(src, cars.join())
 $(this).wrap('<div class="front"></div>')
.parent().wrap('<div class="flipper"></div>')
.parent().wrap('<div class="flip-container"></div>')
.append('<div class="back"><img src="kaart/'+ src[0] + '.png"</img> </div>');
    });

在html>中

<script> 
 document.write ("Those will be mailed" + src[0] + "You get it ? "; ) 
</script>

JSFiddle：http://jsfiddle.net/arunpjohny/dkk2nqyg/9/

很难解释，希望你能明白。

Answer 1

可以在创建元素时使用数据api设置src值。

$(".cards img").each(function (index) {
    var src = cars.splice(Math.floor(Math.random() * cars.length), 1);
    $(this).wrap('<div class="front"></div>')
    .parent().wrap('<div class="flipper"></div>')
    .parent().wrap('<div class="flip-container"></div>')
    .data('src', src[0])
    .append('<div class="back"><img src="' + src[0] + '.png"</img> </div>');
});

然后可以使用以下方法获得所选项的数组

    var selected = $('#dvDest .flipper').map(function(){
        return $(this).data('src')
    }).get();
    //can use ajax to sent this data to server and then mail it

演示：小提琴