使用 jQuery 循环 + 更新数据库答案

【问题标题】：Loop through + update DB with jQuery使用 jQuery 循环 + 更新数据库
【发布时间】：2014-10-31 21:09:23
【问题描述】：

我一直在阅读和尝试不同的东西，但我似乎无法掌握 Jquery 的窍门。

这里是上下文：使用 PHP，我从我的数据库中随机获得十个项目。我按下开始按钮，其中一项显示。然后，用户可以对项目进行评分（喜欢或不喜欢），该结果会在数据库中更新并显示下一个。对十个项目进行评分后，应用程序会重置，您可以再次点击开始按钮重新开始。

现在我还需要使用 jQuery 或 javaScript 来实现这一点，这样用户就不必一直刷新。我不知道如何开始。我知道你们都说“阅读文档”，但老实说，我有，我只需要一些指示，以便弄清楚。

点击开始按钮

<input type="submit" name="action" value="start" />

php 文件中的变量填充这个

<article>
<header>
<h1><?php echo $_SESSION['videos'][$_GET['id']]['title'].' - '. $first.'.'?></h1>
<h2>Originally by <?php echo $_SESSION['videos'][$_GET['id']]['artist'] ?></h2>
</header>
...
<video width="205" height="319"  controls>
<source src="assets/videos/<?php echo $_SESSION['videos'][$_GET['id']]['video'] ?>"type="video/mp4">
</video>

使用这些按钮评分 + 重定向到十个数组中的下一个随机项目

<input type="submit" name="action" value="like" />
<input type="submit" name="action" value="dislike" />

这一切都很好，但我如何让它与 jQ/Js 一起工作？我在想什么：将点击事件链接到开始按钮，防止默认。但是然后呢？我需要从数据库中加载十个随机项目，将第一个附加到正文，然后将点击事件添加到喜欢/不喜欢按钮，防止默认并更新数据库而不重新刷新。

有人指点一下吗？在这里挣扎……

谢谢

【问题讨论】：

尝试查找一些Ajax 示例。你应该能够相对轻松地做你想做的事。
感谢您的快速回复。我确实研究过 Ajax，但我是新手（就像我对 jq 一样）。有什么特别的例子可以给我参考吗？再次感谢您。

标签： javascript php jquery database

【解决方案1】：

这是此类事情的基本流程，但您的实现可以随心所欲地变化

$('input[value="like"]').click(function(){
    var video_id = //however you want to supply video_id here
    $.post('likehandler.php',{id:video_id}, function(result){
        //result is just whatever likehandler.php echos to the screen (usually json_encoded data)
        //your php page would mark the video with the $_POST[id], and then grab a new random video 
        //result.next_video is a json_encoded object from your php page
        if(result.next_video){
            //if your ajax response contains a new video, remove the old, and replace it with the new
            $('video').remove();
            $('body').append("<video width... src='assets/videos/"+result.next_video.video+"' type...">);
        }
    }, 'json');
});

//possible example of likehandler.php
    <?php
        $video_id = $_POST['id'];
        //update video with one more vote in database

       $next_video = //get a random video from database
       echo json_encode(array("status"=>"success","next_video"=>$next_video));
    ?>

这绝对不是复制和粘贴的答案，而是基本流程，并且可以指出它是如何工作的。

【讨论】：