使用ajax简单写一个猜拳游戏

HTML代码

<!DOCTYPE HTML>

<html lang="en-US">

<head>

    <meta charset="UTF-8">

    <title></title>

    <script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.js"></script>

    <select id="check_type">

        <option value="">请选择</option>

        <option value="1">石头</option>

        <option value="2">剪刀</option>

        <option value="3">布</option>

    </select>

    <input type="button" value="猜拳" id="btn" />

    <div id="result"></div>

</head>

<body>

    <script type="text/javascript">

        $(function(){

            //页面加载完毕后开始执行的事件

            $("#btn").click(function(){

                var your_type=$("#check_type").val();

                if(your_type=="")

                {

                    $("#result").text("请选择你出什么");return false;

                }

                $.post("http://localhost/test.php",{"your_type":your_type},function(res){

                    if(res.error_code==0)

                    {

                        //说明成功了

                        $("#result").text("电脑出了"+res.computer_type+" ,结果是您"+res.result);

                    }else

                    {

                        $("#result").text(res.error_message);

                    }

                },"json");

            });

        });

    </script>

</body>

</html>

然后发起后端的请求。接口在test.php中实现

<?php

$your_type=isset($_POST['your_type'])?$_POST['your_type']:"1";//接受用户的选择

if(in_array($your_type,array(1,2,3),true))

{

    //用户选择的不是石头剪子布其中的一个 告知选择不正确

    die(json_encode(array("error_code"=>1,"error_message"=>"猜拳选择不正确")));

}

$type_list=array("1"=>"石头","2"=>"剪刀","3"=>"布");//定义选择对应猜拳

$computer_type=rand(1,3);//电脑随机选择

$diff=$your_type-$computer_type;//计算用户选择与电脑选择的差值

$auto_result=array(

    -2=>"输了",

    -1=>"获胜",

    0 =>"平局",

    1 =>"输了",

    2 =>"获胜",

);//定义好比较结果

$return=array(

    "computer_type"=>$type_list[$computer_type],//电脑选择

    "result"=>$auto_result[$diff],//猜拳结果

    "error_code"=>0,//错误码

    "error_message"=>"ok" //错误提示信息

);

echo json_encode($return);//返回json

exit();

?>

效果如图：

ajax简单手写了一个猜拳游戏的更多相关文章

  1. 简单手写一个jqurey

    1 /** 2 * @description 手写jquery 3 * @author ddxldxl 4 */ 5 class Jquery { 6 constructor(selector) { ...

  2. 为sproto手写了一个python parser

    这是sproto系列文章的第三篇,可以参考前面的<为sproto添加python绑定>.<为python-sproto添加map支持>. sproto是云风设计的序列化协议,用 ...

  3. 10分钟教你用python 30行代码搞定简单手写识别！

    欲直接下载代码文件,关注我们的公众号哦!查看历史消息即可! 手写笔记还是电子笔记好呢? 毕业季刚结束,眼瞅着2018级小萌新马上就要来了,老腊肉小编为了咱学弟学妹们的学习,绞尽脑汁准备编一套大学秘籍, ...

  4. servlet(1) - 手写第一个servlet程序 - 小易Java笔记

    声明:如tomcat的安装目录为D:\Java\tomcat6,下面要根据tomcat的安装目录而定 1. 建立程序的文件结构 ==>找到tomcat的安装目录,在webapps目录下新建一个名 ...

  5. 【Java】 ArrayList和LinkedList实现(简单手写)以及分析它们的区别

    一.手写ArrayList public class ArrayList { private Object[] elementData; //底层数组 private int size; //数组大小 ...

  6. 用JS写了一个打字游戏，反正我是通不了关

    今天想写个简单的游戏, 打字游戏好像都没写过, 那么就写打字游戏吧, gamePad包含了关卡的信息, 可以用来调整给个关卡字符下落的速度: getRandom函数会返回一个字符对象, 这个对象包含了 ...

  7. Neeto-Vue:我为了记笔记，手写了一个为知笔记客户端

    构建自托管的笔记系统 这两年各种笔记系统快速井喷,好像谁都能来掺一脚,app store随便搜索一个关键字就会有一大堆的结果,从老牌的印象笔记,Bear,MWeb,有道云笔记再到新星专注笔记之类,从买 ...

  8. python案例：使用if语句实现一个猜拳游戏

    任务要求: 在控制台中提示输入石头.剪刀.布,按回车键,然后给出游戏结果. 分析: 我们知道在游戏规则中,石头克剪刀,剪刀克布,布克石头.但是这在计算机中并不是很好直接的表示,因此我们分别用0.1.2 ...

  9. 利用SpringBoot+Logback手写一个简单的链路追踪

    目录 一.实现原理 二.代码实战 三.测试 最近线上排查问题时候,发现请求太多导致日志错综复杂,没办法把用户在一次或多次请求的日志关联在一起,所以就利用SpringBoot+Logback手写了一个简 ...

随机推荐

  1. ASP.NET Core 2.0使用Log4net实现记录日志功能

    一.安装Log4net 1.使用Nuget包进行安装 在依赖项上面右键,选择“管理NuGet程序包”,如下图所示: 在浏览界面输入log4net,然后点击安装,如下图所示: 2.使用程序包管理器控制台 ...

  2. IOC容器：Unity

    一.什么是IOC 学习IOC之前先来了解一个依赖导致原则(DIP),依赖导致原则是IOC的核心原理. 依赖导致:即上层模块不应该依赖于低层模块,二者应该通过抽象来依赖.依赖于抽象,而不是依赖于细节. ...

  3. Java初始化顺序（静态变量、静态初始化块、实例变量、实例初始化块、构造方法）

    1.执行顺序 1.1.一个类中的初始化顺序 类内容(静态变量.静态初始化块) => 实例内容(变量.初始化块.构造器) 1.2.两个具有继承关系类的初始化顺序 父类的(静态变量.静态初始化块)= ...

  4. 【2】JVM-JAVA对象的访问

    Java中对象的访问 JAVA是面向对象的语言,那么在JAVA虚拟机中,存在非常多的对象,对象访问是无处不在的.即时是最简单的访问,也会涉及到JAVA栈.JAVA堆.方法区这三个非常重要的内存区域之间 ...

  5. 评点SAP HR功能及人力资源管理软件

    评点SAP HR功能及人力资源管理软件   本文导航 第1页:my SAP 人力资源软件 第2页:my SAP HR协同功能 第3页:组织结构管理 第4页:mySAPTM HR的战略功能 第5页:集成 ...

  6. vector 去除重复元素（sort + unique）

    struct SIndexData { string sCode; int iDate; int iTime; double f1; SIndexData(): iDate(0), iTime(0) ...

  7. WebService系列一：WebService简介

    原文链接:http://www.cnblogs.com/xdp-gacl/p/4259109.html 一.WebService是什么 WebService是一种跨编程语言和跨操作系统平台的远程调用技 ...

  8. （实用）Ubuntu 、CentOS更换国内源

    Ubuntu更换apt-get源 通过编辑/etc/apt/sources.list文件,我们能够更换Ubuntu的默认软件更新源.通常是将其换成一些国内比较知名的源.本文主要列举这些内容. 注意,在 ...

  9. C# wkhtmltopdf 将html转pdf

    一.转换程序代码如下: public string HtmlToPdf(string url) { bool success = true; // string dwbh = url.Split('? ...

  10. Linux中的软链接与硬链接

    软链接相当于windows的快捷方式,当源文件不存在时,软链接失效. 链接是指向文件名,当指向的文件名字删除的时候,就找不到源文件了.硬链接是指向文件本身,删除一个文件名字,还是可以找到源文件的.ls ...