附加到JSON的正确链接

I am trying to make a little application which lists some pics and text from database on index page, and when I click on specific title it takes me to details page where I can find that picture with title and text.

I have made query which lists everything on index page but I can't figure out how exactly should I target the details page, because when I click on the post ID it takes me to details page but it pulls all the other posts with it.

Could someone help me?

My index page:

<script type="text/javascript">

    jQuery(document).ready(function() {
        jQuery.ajax({
            url:"",
            type : "POST",
            dataType : "json",
            data : "param=no",
            success : function (html) {
                var DOM = jQuery('#DOM');
                console.log(html);
                jQuery.each(html, function(key, value){
                    console.log(value);
                    DOM.append("<li><h3><a href='details.php?post_id="+value.post_id+"'</h3> "+value.post_title+"</a></h3> 
<p>"+value.post_author+"</p> 
<img src='admin/news_images/"+value.post_image+"' width='100' height='100'</li>");
                });
            }, 
            error : function (e){ 
                alert(e);
            } 
        });
    });

</script>

This is my fetchdata.php:

<?php

    header ('Access-Control-Allow-Origin:*');

    $con= mysqli_connect ("localhost","root","","mycms");

    $query= mysqli_query ($con, "select * from posts ");

    $arr = array ();
    while ($r = mysqli_fetch_object($query)) {
        array_push($arr, array("post_id" => $r->post_id, "post_title" => $r->post_title, "post_author" => $r->post_author,
"post_image" => $r->post_image));
    }

    print_r(json_encode($arr));

?>

print_r(json_encode($arr)); will not get you a valid json string. print_r() makes your variable human readable and is mainly useful for debugging.

You need:

echo json_encode($arr);