Question

I’m trying to dynamically hide specific photos on a page, through Javascript, by selecting their data-id attribute and hiding the photo. This is being achieved through Ajax grabbing the IDs from a TXT file, splitting them in to an Array, and then using jQuery to hide the img with that ID. Note that this function is being passed through a setInterval every 3 seconds…

    function getBlockedIDs() {
            var stringData = $.ajax({
                    url: "http://s61892.gridserver.com/zone/twitter2/blocked.txt",
                    async: false
            }).responseText;
            var blockedArray = new Array();
            blockedArray = stringData.split(",");
            var length = stringData.length
            for (var i = 0; i < length; i++) {
                    $('img.tweetphoto[data-id="' + stringData[i] + '"]').hide();
            }
    }

My problem is, it’s not working! No errors are thrown from the console. What’s wrong with my code? The idea behind this is to block specific (inappropriate) photos without reloading the page.

Any help is appreciated!

Answer 1

Are you sure you want to use stringData inside the for loop and not blockedArray? If so change the assignment to length also.

My version would look something like :

     function getBlockedIDs() {
        var blockedArray = $.ajax({
                url: "http://s61892.gridserver.com/zone/twitter2/blocked.txt",
                async: false
        }).responseText.split (/\s*,\s*/);
        for (var i = blockedArray.length; i--;) {
                $('img.tweetphoto[data-id="' + blockedArray[i] + '"]').hide();
        }
}