简体   繁体   中英

Javascript Splice array value

Couple days ago I have asked a question, I will link it here, since it has some explanations about what I want, so you can get a idea what I want to do, JavaScript array splice This is solved now, and the codes works fine, But now I want to get the value of the card that has been spliced ( the cards we get when we drag them in box and click on it )

I thought this would be simple, but I guess I am wrong,

Concrete: I want that the user picks up 3 cards, and this will be mailed to the owner of the website, at the moment I can pick up 3 cards, by using splice the user can not pick multiple the same card, but now I want that the cards that it picks up, turn into a variable or something that I can mail them later.

$(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>');
    });

in the html>

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

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

quite hard to explain, hope you get the idea.

You can set the src value using data api while creating the elements

$(".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>');
});

then you can get an array of selected items using

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

Demo: Fiddle

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM