Javascript PHP从数据库中检索新图像

很抱歉问了NOOB这个问题，但我还在学习

首先，我不是要求某人为我编程以下问题或给我代码。我只是想从逻辑上寻求一些帮助和建议

我想做的事

这只是一个例子，我尝试做的是不同的，但将使用相同的逻辑：我尝试在我的网站上显示一张电影海报，用户可以对该电影进行0-5星级评分，他/她的评分将与其他用户的评分一起记录在数据库中。当他/她完成评级后，需要展示一张新的电影海报，他/她可以再次对海报进行评级，直到他/她厌倦了电影评级

逻辑

• 我假设我需要在这里使用PHP来存储和检索数据
• 将创建一个表，其中包含与该电影评级相对应的不同图像和评级，以及为该电影评级的用户数，以计算总评级的平均值

问题

• 在用户对图像进行评级后，如何使图像更改

• 是否可以像使用Javascript一样使用PHP更改图像src onclick

• 如果是，我该怎么做？我可能需要在这里结合使用PHP和Javascript吗

---

任何帮助或建议都将不胜感激。提前感谢您。

您肯定需要同时使用javascript和PHP来完成此任务

我会这样处理：

<img id="movie-poster" src="movie poster src" />
<ul>
  <li class="rating-button">1</li>
  <li class="rating-button">2</li>
  <li class="rating-button">3</li>
  <li class="rating-button">4</li>
  <li class="rating-button">5</li>
</ul>
<script>
var currentUserId;
var currentMovieId;
$('.rating-button').on('click',function() {
  $.ajax({
    url: "URL of PHP script here",
    type: 'post',
    data: {'movieId':currentMovieId, 'userId':currentUserId, 'rating':$(this).text()},
    dataType: 'json',
    success: function(response) {
      // this runs after your PHP script has responded
      // update your page with the new movie here
      alert('thanks for voting');
      currentMovieId = response.newMovieId;
      $('#movie-poster').attr('src',response.newMoviePosterSrc);
    }
  });
}
</script>

a） 使用jqueryjavascript库可以简化javascript

b） 编写一些javascript来响应用户选择的评级。您可能需要绑定到评级按钮的onClick事件

c） 单击评级按钮时，javascript函数应使用jQuery.ajax通过HTTP POST将所选评级发送到服务器。发送到服务器的数据可能需要包含一个标识电影的ID、一个代表用户的ID（这样您就可以阻止人们对同一部电影进行多次投票）以及他们选择的评级

d） 在服务器端，您可以编写一个PHP脚本来处理投票提交。它将检查电影和用户ID（存储在PHP的$u POST变量中），然后将评级保存到某个数据库中。然后，它还可以将响应发送回客户端，其中包含下一个电影id和下一张海报。我建议您使用json_encode以javascript易于解释的方式存储此信息

e） 最后，回到客户端，您的javascript代码可以对PHP发送回来的数据做出反应，方法是显示一条类似“感谢您的投票”的消息，然后更改屏幕上的电影详细信息，将其替换为新的

您的客户端代码看起来有点像这样：

<img id="movie-poster" src="movie poster src" />
<ul>
  <li class="rating-button">1</li>
  <li class="rating-button">2</li>
  <li class="rating-button">3</li>
  <li class="rating-button">4</li>
  <li class="rating-button">5</li>
</ul>
<script>
var currentUserId;
var currentMovieId;
$('.rating-button').on('click',function() {
  $.ajax({
    url: "URL of PHP script here",
    type: 'post',
    data: {'movieId':currentMovieId, 'userId':currentUserId, 'rating':$(this).text()},
    dataType: 'json',
    success: function(response) {
      // this runs after your PHP script has responded
      // update your page with the new movie here
      alert('thanks for voting');
      currentMovieId = response.newMovieId;
      $('#movie-poster').attr('src',response.newMoviePosterSrc);
    }
  });
}
</script>

1
2
3
4
5

var-currentUserId；
var-currentMovieId；
$（'.rating按钮'）。在（'click'，function（）上{
$.ajax({
url:“此处PHP脚本的url”，
键入：“post”，
数据：{'movieId'：currentMovieId，'userId'：currentUserId，'rating'：$（this）.text（）}，
数据类型：“json”，
成功：功能（响应）{
//这将在PHP脚本响应后运行
//在此处使用新电影更新您的页面
警惕（“感谢投票”）；
currentMovieId=response.newMovieId；
$（“#电影海报”）.attr（'src'，response.newMoviePosterSrc）；
}
});
}

您的PHP脚本看起来有点像这样（您必须自己找出所有数据库和用户身份验证位）

---

您肯定需要同时使用javascript和PHP来实现这一点

我会这样处理：

<img id="movie-poster" src="movie poster src" />
<ul>
  <li class="rating-button">1</li>
  <li class="rating-button">2</li>
  <li class="rating-button">3</li>
  <li class="rating-button">4</li>
  <li class="rating-button">5</li>
</ul>
<script>
var currentUserId;
var currentMovieId;
$('.rating-button').on('click',function() {
  $.ajax({
    url: "URL of PHP script here",
    type: 'post',
    data: {'movieId':currentMovieId, 'userId':currentUserId, 'rating':$(this).text()},
    dataType: 'json',
    success: function(response) {
      // this runs after your PHP script has responded
      // update your page with the new movie here
      alert('thanks for voting');
      currentMovieId = response.newMovieId;
      $('#movie-poster').attr('src',response.newMoviePosterSrc);
    }
  });
}
</script>

a） 使用jqueryjavascript库可以简化javascript

b） 编写一些javascript来响应用户选择的评级。您可能需要绑定到评级按钮的onClick事件

c） 单击评级按钮时，javascript函数应使用jQuery.ajax通过HTTP POST将所选评级发送到服务器。发送到服务器的数据可能需要包含一个标识电影的ID、一个代表用户的ID（这样您就可以阻止人们对同一部电影进行多次投票）以及他们选择的评级

d） 在服务器端，您可以编写一个PHP脚本来处理投票提交。它将检查电影和用户ID（存储在PHP的$u POST变量中），然后将评级保存到某个数据库中。然后，它还可以将响应发送回客户端，其中包含下一个电影id和下一张海报。我建议您使用json_encode以javascript易于解释的方式存储此信息

e） 最后，回到客户端，您的javascript代码可以对PHP发送回来的数据做出反应，方法是显示一条类似“感谢您的投票”的消息，然后更改屏幕上的电影详细信息，将其替换为新的

您的客户端代码看起来有点像这样：

<img id="movie-poster" src="movie poster src" />
<ul>
  <li class="rating-button">1</li>
  <li class="rating-button">2</li>
  <li class="rating-button">3</li>
  <li class="rating-button">4</li>
  <li class="rating-button">5</li>
</ul>
<script>
var currentUserId;
var currentMovieId;
$('.rating-button').on('click',function() {
  $.ajax({
    url: "URL of PHP script here",
    type: 'post',
    data: {'movieId':currentMovieId, 'userId':currentUserId, 'rating':$(this).text()},
    dataType: 'json',
    success: function(response) {
      // this runs after your PHP script has responded
      // update your page with the new movie here
      alert('thanks for voting');
      currentMovieId = response.newMovieId;
      $('#movie-poster').attr('src',response.newMoviePosterSrc);
    }
  });
}
</script>



1
2
3
4
5

var-currentUserId；
var-currentMovieId；
$（'.rating按钮'）。在（'click'，function（）上{
$.ajax({
url:“此处PHP脚本的url”，
键入：“post”，
数据：{'movieId'：currentMovieId，'userId'：currentUserId，'rating'：$（this）.text（）}，
数据类型：“json”，
成功：功能（响应）{
//这将在PHP脚本响应后运行
//在此处使用新电影更新您的页面
警惕（“感谢投票”）；
铜