Загрузка страницы с нефиксированным количеством изображений, которые могут быть изменены

Я в настоящее время работаю над веб-сайтом и попал в довольно плохую позицию, где я смешиваю javascript и php так, что я не думаю, что должен (см., например, код ниже). Для записи я абсолютный noob в js, я обычно делаю только бэкэнд.Загрузка страницы с нефиксированным количеством изображений, которые могут быть изменены

То, что я пытаюсь достичь, получить пути изображения из базы данных (сделано), показать их на экране (сделано, если статично), а затем иметь дополнительный контейнер, который отображает только выбранное изображение (пользователем) из список загруженного изображения.

Теперь, если он был статичным, я мог бы просто откликнуться на php и сделать это, но поскольку он не исправлен, я должен использовать js, где все становится грязным. Js «не знает», сколько изображений есть, идентификаторы тегов, чтобы иметь возможность их изменять и т. Д.

Чтобы уточнить, все изображения, используемые на странице, загружаются один раз в некотором php-коде в самой верхней части страницы, а затем должны быть только js, обрабатывающие их и перемещающие их и выбирая их. Но я думаю, что все, что мне нужно сейчас, это способ передачи значений в js из php, а затем создание страницы через javascript.

Есть ли простой способ сделать то, что я говорю?

пример грязного кода:

<script> 

    var foodImages; 
    <?php $i = 0; ?> 

    var numberOfImages = <?php echo $count; ?>; 

    for(var i=0; i< numberOfImages; i++){ 
     foodImages.push(<?php echo $foodImages[$i]?>); 
     <?php $i ++; ?> 
    } 

    var selectedFood = <?php echo defaultSelected; ?>; 

</script>

Спасибо и хорошего дня!

источник

2016-07-24 Dominus

вы можете запросить изображения через ajax! –

Вы могли бы сделать вызов ajax для php-скрипта, когда это необходимо, и использовать этот скрипт php для возврата значений, отображаемых на странице, а затем в js итерации по количеству изображений в ответе, отображая их на странице? – Stu

Но разве это не создавало бы ненужные вызовы и задержки базы данных? (перезагружать изображения каждый раз) – Dominus

Вы не можете использовать $ рассчитывать, как кол ($ массив) в PHP, удалить «$», чтобы быть:

<?php 
$numFoods=count($foodImages); 
?> 
    var numberOfImages = <?=$numFoods;?>;

источник

2016-07-24 12:04:59 kollein

о да, забыл упомянуть, что $ count был инициализирован ранее! (опечатка в коде была написана мной как функция – Dominus

Редактирование цикла для исправления: for (var i = 0; ...) отсутствует kwd "var". – kollein

Таким образом, вы могли бы применить их непосредственно к DOM в вашем PHP скрипт;

<?php 
... 
foreach($foodImages as $image) { 
    ?><img src="<?php echo $image; ?>" class="food-image"><?php 
}

а затем подберите их в своем js;

<script> 
... 
var foodImages = document.getElementsByClassName('food-image');

Теперь у вас есть массив элементов DOM в foodImages переменной расслоение плотной использовать, как вам нравится?

источник

2016-07-24 12:27:26 Stu

Загрузка страницы с нефиксированным количеством изображений, которые могут быть изменены

ответ

Смежные вопросы