Функция добавления Javascript не будет дублировать img src на каждой карте - PullRequest
Новая
       11

Функция добавления Javascript не будет дублировать img src на каждой карте

0 голосов
/ 12 января 2019

У меня есть следующий код, который должен пройти по массивам и распечатать карту для каждого. Это работает, когда я жестко кодирую свой img src для пути на моем компьютере. Когда я пытаюсь использовать массив изображений, мои карты перестают дублироваться. Я знаю, что мой массив заполнен, потому что я извлекаю его из другого места в моем коде. Я, очевидно, не ставлю правильные цитаты вокруг вещей. Может кто-то видит что-то не так? 

    var names= <?php echo json_encode($Names); ?>;
    var colors= <?php echo json_encode($Color); ?>;
    var Images= <?php echo base64_encode($Image); ?>;

    //Can use variable as selector, not that I'm using a specific selector
    //Try using array of arrays and pick one to each loop over
    $(document)
        .ready(function() {

            $.each(colors, 
                function(i, value) {
                    $('.main_card_shell').append(
                    "<div class='card_content card_style' id='card0'>" +

                           "<div class='subcard_style box_title'>" + 
                           "<img class='card_image' src='data:image/png;base64, " + Images[i] + "' alt='Item #1' />" +      


                               '<div class="profile">' +
                                   '<div class="card_number">' + value + '</div>' +
                                   '<div class="card_name">' + names[i] + '</div>' +
                                   '<div class="tag_row">' +
                                       '<div class="sample_item sample_item4"></div>' +
                                       '<div class="sample_item sample_item3"></div>' +
                                   '</div>' +
                               '</div>' +
                           '</div>   ' +
                           "<div class='subcard_style box_status'>" +

1 Ответ

0 голосов
/ 12 января 2019

Цитаты выглядят хорошо в моих глазах. Но потому что Изображения это не массив 

var Images= <?php echo base64_encode($Image); ?>;

это не может работать 

"<img class='card_image' src='data:image/png;base64, " + Images[i] + "' alt='Item #1' />"

[обновление]

В вашем php-коде вы используете base64_encode ($ image [$ i]). Но с 

var Images= <?php echo base64_encode($Image); ?>;

Вы кодируете массив, а не изображения в массиве. Попробуйте вместо этого: 

var Images = []; 
<?php
for ($i = 0; $i < count($image); $i += 1) {
  echo 'Images['.$i.'] = "'.base64_encode($image[$i]).'";';
}
?>

Таким образом, значение каждого элемента в вашем массиве JavaScript - это base64_encoded представление значения в вашем массиве php $ image.

Убедитесь, что написание $ image правильное. В своем комментарии вы используете $ image [0], но во фрагменте кода это $ Image.

...