简单的看图猜名

1. 效果如下，页面布局较简易，可自行布局

2. 基本思路

  *图片的如何切换

  *点击提交 对比对应的第几张图片是否与自己设置的答案一致，一致就切换图片下一个

  *提示为 随机提示设置的答案里的一个字，一张图片只能提示一次（可根据自己的想法设置）

  *点击答案时应跳出一个广告，广告结束后跳出正确答案

3.图片的切换

  *准备几张图片更改格式，使它们有规律如：A1 A2 A3 A4 A5等

  *加入img标签路径通过JS来赋值修改

  *通过ID获取到img标签，通过setAttribute修改src属性

   n为自定义，记录第几张图片(var n=1 //从第一张开始 全局变量)

4.给对应图片赋值答案(var name=””//全局变量，记录每一张图片的 答案)

 *因为n为记录第几张图片，所有根据n来给对应的图片赋予答案

5. 点击提交，输入内容与答案（name）对比

  *如果输入的内容与答案一致则提示下一个

  *n++（下一张图片）

  *清空输入框（方便玩家继续答题）

  *重新调用切换图片（此时n为2所有会切为第二张图片）

  *hintint为全局变量，记录提示几次,下一关需重置提示次数

 

6.点击提示操作

   *判断hintint是否为初始值零，为零即没有提示过可提示

   *获取答案（name）的长度

   *在答案的规定长度内随机生成一个数

   *name[zz] :zz为随机数（即随机提示答案内的一个字）

   *hintint++ ：即记录提示为一次，hintint不为零不能提示第二次

     只能下一关的时候重置hintint才能再次提示

 

7.点击答案

   *guang为广告窗体，可根据自己需设置（此处只是一个隐藏与显示）实现类式“广告”

   *guangao：全局变量，初始值自己设置，即广告时间

   *clearInterval（answer）；停止倒计时

   *setTimeout(answer,1000);为每一秒调用一次自身函数，值到广告时间为0；

 

以上便是一个简易版的看图猜名