масcив из php в js

Question

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

<?php
$server =$_SERVER['localhost'];
$username = '#';
$password = '#';
$dbname = '#';
$charset = 'utf8';

$connection = new mysqli($server, $username, $password, $dbname);

if($connection->connect_error){
    die("Ошибка соединения ".$connection->connect_error);
}

if(!$connection->set_charset($charset)){
    echo "Ошибка установки кодировки UTF8";
}
?>

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Загрузка картинки в БД</title>
</head>

<body>

<div style="width:500px; height:500px;">
    <?php
        $query = $connection->query("SELECT * FROM images ORDER BY id DESC");
        while($row = $query->fetch_assoc()){
            $show_img = base64_encode($row['img']);
        
            $array[] = base64_encode($row['img']);;
            ?>
     
    <script type="text/javascript>
    var i =0
    while(i<3){
        var arr[i] = <?=$array[0]?>;
        i++;
    }
        
    </script>
    
    <div id="slider"><img src="" alt="Работа"></div>
    
    <script type="text/javascript>
        var slider = document.querySelector('#slider');
        var img = slider.querySelector('img');

        img.src = "data:image/jpeg;base64," + arr[1];
    </script>
</div>
</body>
</html>

Answer 1

через ajax, самый годный вариант.

в index.php :

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Загрузка картинки в БД</title>
    <script
            src="https://code.jquery.com/jquery-3.6.1.min.js"
            crossorigin="anonymous"></script>

    <script>

        $.ajax({
            url: '/test_ajax.php',
            method: 'POST',
            dataType: 'json',
            data: {
                'event':'active'
            },
            success: function(data) {
                var imgArr = data;

                var slider = document.querySelector('#slider');
                var img = slider.querySelector('img');

                img.src = "data:image/jpeg;base64," + imgArr[1];
            }
        });

    </script>
</head>

<body>

<div style="width:500px; height:500px;">
    <div id="slider"><img src="" alt="Работа"></div>

</div>
</body>
</html>

в test_ajax.php

<?php
$arr = ['img', 'img1','img2'];

$event = $_POST['event'];
if ($event == 'active'){
    echo json_encode($arr);
} else {
    echo json_encode('the wrong event');
}

БЛОГ НА HUSL

масcив из php в js

Ответы (1 шт):