how to get the value of an php array in jQuery - php

Question

i have a PHP code that will obtain the total images of a certain website via CURL, and put it inside an PHP loop.
$z=1;
for ($i=0;$i<=sizeof($images_array);$i++) {
....<img src = "$images_array[$i]" id="$z"> ..
$z++;
}
a user can then scan through the array with a prev/next button and the current image being shown will be displayed in my $('$current_image').val(1);
$.post("curl_fetch.php?url="+ extracted_url, {
}, function(response){
$('#loader').html($(response).fadeIn('slow'));
$('#current_image').val(1); // insert loop value in .val()
when i click a button, i want to get the value of the array, and not the loop value
$(function() {
$(document).on('click','.submit', function () {
var img = $('#current_image').val(); //get the array value, not the loop value
alert(img);
});});
now, how do i properly get the array value in my $('#current_image').val(1); in Jquery.

Answer 1

Your question is a little confusing but it sounds like you want to fetch a list of images using curl and then be able to page through them one by one using jQuery. One way to do this would be to build a javascript array of the image URLs and then just update the value of the img src using that array.
<!-- load the page with the first image -->
<img src="<?php echo $images_array[0]; ?>" id="visible_img"></img>
<button id="previous"><< previous</button>
<button id="next">next >></button>
<!-- setup a javascript array of images and listen for clicks -->
<script type="text/javascript">
var curIdx = 0;
var imageUrls = ["<?php echo implode('","', $images_array); ?>"];
// display the previous image (if there is one)
$("#previous").click(function() {
if (curIdx > 0) {
curIdx--;
$("#visible_img").attr("src", imageUrls[curIdx]);
}
});
// display the next image (if there is one)
$("#next").click(function() {
if (curIdx < imageUrls.length - 1) {
curIdx++;
$("#visible_img").attr("src", imageUrls[curIdx]);
}
});
</script>