Find index in array different from the array that loaded

Question

Line 35, just before the alert, returns -1. I also tried $(this).index() with the same result. Here is what it should do: Clicking EN.gif should return 4, then grand_array_pics[4] should give me en_array_pics and load the .gifs in that array.

$(document).ready(function () {

    var main_pics = ["AN.gif", "BN.gif", "CN.gif", "DN.gif", "EN.gif", "GN.gif"];

    var starting_pics = ["AN.gif", "CN.gif", "EN.gif"];

    var an_array_pics = ["BN.gif", "EN.gif", "GN.gif", "AN.gif","DN.gif"];
    var bn_array_pics = ["CN.gif", "DN.gif", "GN.gif"];
    var cn_array_pics = ["DN.gif", "GN.gif", "AN.gif", "CN.gif"];
    var dn_array_pics = ["EN.gif", "AN.gif", "CN.gif"];
    var en_array_pics = ["GN.gif", "AN.gif", "CN.gif", "EN.gif"];
    var gn_array_pics = ["AN.gif", "CN.gif", "EN.gif", "GN.gif"];

    var grand_array_pics = [
        an_array_pics,
        bn_array_pics,
        cn_array_pics,
        dn_array_pics,
        en_array_pics,
        gn_array_pics
    ];

    var i = 0;

    for (i = 0; i < starting_pics.length; i++) {
        $("<img/>").attr("src", "images/" + starting_pics[i]).load(function () {
            $(this).appendTo("#main");
            $(this).addClass("pics");
        });
    }

    $("#main").on("click", ".pics", function () {

        var j = $.inArray(this, main_pics);
        alert(j);

        $("#sidebar .pics").remove();
        $(this).clone().appendTo("#train");
        $(this).clone().appendTo("#sidebar");
        $("#main .pics").remove();

        var chosen_pics_array = grand_array_pics[j];
        var count = chosen_pics_array.length;

        var k = 0;

        for (k = 0; k < count; k++) {
            $("<img/>").attr("src", "images/" + chosen_pics_array[k]).load(function () {
                $(this).appendTo("#main");
                $(this).addClass("pics");
            });
        }
    });
});       //end ready

Bergi · Accepted Answer · 2013-07-31 19:27:29Z

1

this is the DOM <img> element, while main_pics is an array of strings. It will never be found inside there. Use

var j = $.inArray(this.src.split("/").pop(), main_pics);

answered Jul 31, 2013 at 19:27

Bergi

671k162 gold badges1k silver badges1.5k bronze badges

Sign up to request clarification or add additional context in comments.

Comments

kalley · Accepted Answer · 2013-07-31 19:26:59Z

1

Give this a try. You need to get the name of the file and you're passing the element itself into $.inArray

var j = $.inArray(this.src.substring(this.src.lastIndexOf('/')+1), main_pics);

answered Jul 31, 2013 at 19:26

kalley

18.5k2 gold badges41 silver badges37 bronze badges

4 Comments

kalley Over a year ago

jsperf for performance difference between substring/lastIndexOf and split/pop

kalley Over a year ago

You can't mark both. You can upvote both, but not mark them both as correct.

Bergi Over a year ago

@jwelter: See stackoverflow.com/about and stackoverflow.com/help/privileges/vote-up

kalley Over a year ago

The arrows above/below the numbers. Above upvotes – meaning it's a useful answer, below downvotes – meaning this doesn't help at all.

Collectives™ on Stack Overflow

Find index in array different from the array that loaded

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related