使用Ajax将PHP的JQuery值转换为PHP？

My Website has a Video Player with a random Playlist and a Comments List.

All Comments ever written are loaded. Now I want to change the comments ID, everytime a new Video starts, so that the Site shows only comments for this Video.

The Player is set up in Javascript and has an on Ready Function, that fires an ajax function. The Comments are set up as a php line with a $value.

This is my code:

<div id="comments">
  <?php 
    $commentsID= 3; //Testnumber 3 shows all comments to video 3
    Comment::getCommentSystem($commentsID);
  ?>
</div>

<script>
onReady: function(event) {
videoID; // actual videoID
//and here comes some Ajax Magic, to tell $commentsID = videoID, but how?
// My example doesn't work because it's my first try with Ajax whoohooo
$.ajax({
  type: "GET",
  url: "index.php",
  data: videoID,
  success: function(videoID){
    $('#comments').empty(); // Clear Testnumber'n stuff
    $(' <?php 
      $commentsID= videoID; 
      Comment::getCommentSystem($commentsID);
    ?>
 ').appendTo('#comments'); // rewrite the comments Div with the videoID
 }
}); 
</script> 

EDIT:

Now my code looks like this:

<div id="comments">
</div>

<script>
[...]
onReady: function(event) {
     videoID; // actual videoID
     $.ajax({
       type: "GET",
       url: "get_comments.php?videoId=" + videoID,
       success: function(response){
         $('#comments').html(response);
   }
     });
}
[...]
</script>

get_comments.php

<?php
session_start();
include "comment.class.php";
$videoID = $_GET["videoId"];
$comments = Comment::getCommentSystem($videoID);
return($comments);
?>

and it produces this:

<div id="comments">

  <!-- The Form to add a comment ( always display none ) -->
  <div style="display:none;">
    <div class="comment-post comment-child">
      <form id="addCommentForm" action="" method="post">

<!-- The Form container, that shows the Form comment -->
<!-- ( should be visible - maybe session fail? ) -->
<div class="comment-container" style="display:none;">
  <div class="comment-content">

<!-- all comments to videoID 3 -->
<ul class="comment-list-3">
</div>

Do not send it index.php, send request to another endpoint like get_comments.php,

<script>
    onReady: function(event) {
    videoID; // actual videoID
    //and here comes some Ajax Magic, to tell $commentsID = videoID, but how?
    // My example doesn't work because it's my first try with Ajax whoohooo
    $.ajax({
      type: "GET",
      url: "get_comments.php?videoId=" + videoID,
      success: function(response){
        $('.comment-list-3').empty(); // Clear Testnumber'n stuff
        var html = '';
        $.each(response, function(i, item) {
            // Do your html here. I assume, your comment object has a field "text". Update it according too your need
            html += '<div>' + item.text + '</div>';
        });
        $('.comment-list-3').html(html); // rewrite the comments Div with the videoID
     }
    }); 
</script>

and in your get_comments.php;

<?php

$videoID = $_GET["videoId"];
$comments = Comment::getCommentSystem($videoID); // Let say this is array
echo json_encode($comments);
?>

As Hüseyin BABAL mentioned you could use $_GET to recieve a video id and then prepare the page. Yuou could store the $_GET value in an attribute (for example: data-video-id="3") so you can read it using JS/jQUery. It is possible to fetch URL parts using JS but it is a bit more difficult.

WARNING: If you work with user input (like $_GET and $_POST) ALWAYS validate input.