在实际的项目中用到了leancloud三方服务器存储,实现的简单的购物调查实验,觉得还不错,记录一下

主页,欢迎页

1.cookie缓存技术,为首次进入的用户随机生成id,保证同一个用户每次进入的身份保持一致,增加实验调查的准确性,

2.俩种实验场景,使实验更加丰富有趣,调查结果多样性,数据可靠

3.将用户信息用leancloud存入服务器,记录数据

  <!DOCTYPE HTML>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1, maximum-scale=1,user-scalable=no" />
  <meta name="format-detection" content="telephone=no">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="blank" />
  <title>模拟购物实验</title>
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/base.css">
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/index.css">
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/fontSize.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/jquery-1.10.2.min.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-mini-0.6.4.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-core-mini-0.6.4.js"></script>
  </head>
  <body>
  <div class="title">模拟购物实验</div>
  <div class="desc">
  <p> 亲爱的朋友,您好!非常感谢您抽出宝贵的时间来参与我们的模拟购物实验,本次实验将花费大约3-5分钟的时间。</p>
  </div>
  <div class="ruleHead">
  <p><img src="//image.buslive.cn/awjdc_1222/images/logo.png" alt=""><span>实验说明</span></p>
  </div>
  <div class="desc">
  <p>1.<em>购买产品前</em>,请您仔细阅读购买任务内容,当您确定已经完全清晰需要进行的购买任务后,点击“开始购物”按钮就可以开始购买啦
  </p>
  </div>
  <div class="desc">
  <p>2.<em>购买过程中</em>,请您认真浏览购买界面的产品,并将您中意的产品放入购物车内,点击“结算”按钮则视为购买成功
  </p>
  </div>
  <div class="desc">
  <p>3.<em>购买任务结束后</em>,请您帮助我们回答四个问题,点击“提交”按钮则本次模拟购物实验即为结束。
   
  </p>
  </div>
  <div id="text"></div>
  <div class="nobuy buyBtnToo">
  <a href="javascript:void(0)">开始购物<em class="times"></em></a>
  </div>
   
  </body>
  <script>
  //设定倒数秒数
  var t = 10;
   
  function showTime(){
  $(".times").html(t);
  if(t==0){
  $(".nobuy").addClass("toBuyBtn");
  $(".nobuy a").css("background-color","#ff5a11");
  $(".times").html("");
  clearInterval(timesInterval);
  }
  t -= 1;
  }
   
  timesInterval = setInterval("showTime()",1000);
   
   
  //随机情景
  function mrc() {
  butong_net = [
  {'type':1,'value':"<h3>购物情景:</h3>  部门打算举办一个小型的年会party,您作为部门的采购人员负责购买年会幸运奖奖品。部门有男、女同事不等,<em>您需要购买至少5个不同的鼠标</em>作为本次活动的幸运奖品,具体购买内容则由您自己决定。"},
  {'type':2,'value':"<h3>购物情景:</h3>  为了丰富同学们的课余生活,班级成立了图书角,您作为班长负责购买一些图书,班级里有男生、女生不等,<em>要求至少购买5本不同的图书</em>,具体购买内容则由您自己决定。"}
  ];
  butong_net2 = Math.floor(Math.random() * butong_net.length);
  $("#text").html(butong_net[butong_net2].value);
   
  }
  mrc();
   
  function skip(){
  if(butong_net[butong_net2].type==1){
  location.href="mouse.html";
  }else{
  location.href="book.html";
  }
  }
   
  </script>
  <script>
   
  //存 取cookie
  function getCookie(name) {
  var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   
  if(arr=document.cookie.match(reg))
  return unescape(arr[2]);
  else
  return null;
  }
   
  //设置cookie
  function setCookie(name,value) {
  var Days = 30;
  var exp = new Date();
  exp.setTime(exp.getTime() + Days*24*60*60*1000);
  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
  }
   
  $(function(){
  var user_num = getCookie('user_num');
  if (!user_num) {
  user_num = Math.random();
  setCookie('user_num', user_num);
  }
   
   
  //存储数据
  $(document).on("click",".toBuyBtn a",function(){
  var user_num_data = getCookie('user_num');
  var cut_user_num_data = (user_num_data.substring(2));
   
  AV.initialize('WVcpwOApF0G5SMl5kr2dLfhW-gzGzoHsz', 'pB6JnQf7i8l4RkShabUT4bWl');
  var homePage = AV.Object.extend('homePage');
  var testObject = new homePage();
   
  testObject.save({
  user_num : cut_user_num_data
  }, {
  success: function(object) {
  skip();
  }
  }, function(error) {
  alert(error);
  });
  });
  });
  </script>
  <script>
  var _hmt = _hmt || [];
  (function() {
  var hm = document.createElement("script");
  hm.src = "//hm.baidu.com/hm.js?818abfb5827257869fc349f7a2be4c29";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
  })();
  </script>
  </html>

实验调查页面:

实验模型1:

1.获取首页生产cookie来匹配用户身份,保持用户身份一致

2.模拟简单的购物车加入,移除功能

3.实验设置俩种模式,热门商品和普通商品,从每种二十个商品中随机抽取0-8中不等,随机生成商品列表,增加数据可靠性

4.将用户购买的商品数组信息与cookie存储到服务器

  <!DOCTYPE HTML>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1, maximum-scale=1,user-scalable=no" />
  <meta name="format-detection" content="telephone=no">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="blank" />
  <title>书籍</title>
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/base.css">
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/mouse.css">
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/fontSize.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/jquery-1.10.2.min.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/function.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-mini-0.6.4.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-core-mini-0.6.4.js"></script>
  </head>
  <body>
  <div class="listBox" style="height:9.5rem;overflow:auto;">
  <!-- <div class="banner">
  <ul class="swiper-wrapper">
  <li class="swiper-slide"><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book_swiper/b1.jpg"></a></li>
  <li class="swiper-slide"><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book_swiper/b2.jpg"></a></li>
  <li class="swiper-slide"><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book_swiper/b3.jpg"></a></li>
  <li class="swiper-slide"><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book_swiper/b4.jpg"></a></li>
  <li class="swiper-slide"><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book_swiper/b5.jpg"></a></li>
  </ul>
  <div class="bannerSum"></div>
  </div> -->
   
  <div class="hotList">
  <h3>热门推荐</h3>
  <ul></ul>
  </div>
  <div class="commonList">
  <h3>商品列表</h3>
  <ul>
  <li id="img_1">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b1.jpg"></a></aside>
  <article>
  <h6>一桩事先张扬的凶杀案</h6>
  <p>¥<em>21.30</em></p>
  <p>130000<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_2">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b2.jpg"></a></aside>
  <article>
  <h6>奇迹</h6>
  <p>¥<em>23.20</em></p>
  <p>110000<em>条评论</em></p>
  <p>95%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_3">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b3.jpg"></a></aside>
  <article>
  <h6>湖畔</h6>
  <p>¥<em>27.20</em></p>
  <p>71000<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_4">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b4.jpg"></a></aside>
  <article>
  <h6>酷酷的代课老师</h6>
  <p>¥<em>23.30</em></p>
  <p>71000<em>条评论</em></p>
  <p>97%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_5">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b5.jpg"></a></aside>
  <article>
  <h6>图书光奇谈</h6>
  <p>¥<em>22.10</em></p>
  <p>40000<em>条评论</em></p>
  <p>94%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_6">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b6.jpg"></a></aside>
  <article>
  <h6>清道夫</h6>
  <p>¥<em>24.80</em></p>
  <p>18000<em>条评论</em></p>
  <p>95%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_7">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b7.jpg"></a></aside>
  <article>
  <h6>余罪:我的刑侦笔记</h6>
  <p>¥<em>22.30</em></p>
  <p>16000<em>条评论</em></p>
  <p>95%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_8">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b8.jpg"></a></aside>
  <article>
  <h6>别相信任何人</h6>
  <p>¥<em>21.80</em></p>
  <p>11000<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_9">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b9.jpg"></a></aside>
  <article>
  <h6>新参者</h6>
  <p>¥<em>33.60</em></p>
  <p>8500<em>条评论</em></p>
  <p>97%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_10">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b10.jpg"></a></aside>
  <article>
  <h6>红手指</h6>
  <p>¥<em>33.60</em></p>
  <p>8500<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_11">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b11.jpg"></a></aside>
  <article>
  <h6>布谷鸟的呼唤</h6>
  <p>¥<em>40.50</em></p>
  <p>3400<em>条评论</em></p>
  <p>97%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_12">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b12.jpg"></a></aside>
  <article>
  <h6>离别曲</h6>
  <p>¥<em>40.60</em></p>
  <p>3200<em>条评论</em></p>
  <p>99%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_13">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b13.jpg"></a></aside>
  <article>
  <h6>盗墓笔记2</h6>
  <p>¥<em>23.30</em></p>
  <p>2800<em>条评论</em></p>
  <p>98%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_14">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b14.jpg"></a></aside>
  <article>
  <h6>盗墓笔记7</h6>
  <p>¥<em>23.60</em></p>
  <p>2700<em>条评论</em></p>
  <p>91%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_15">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b15.jpg"></a></aside>
  <article>
  <h6>单恋</h6>
  <p>¥<em>22.10</em></p>
  <p>2300<em>条评论</em></p>
  <p>92%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_16">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b16.jpg"></a></aside>
  <article>
  <h6>犯罪心理档案</h6>
  <p>¥<em>39.90</em></p>
  <p>1200<em>条评论</em></p>
  <p>89%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_17">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b17.jpg"></a></aside>
  <article>
  <h6>奇风岁月</h6>
  <p>¥<em>30.60</em></p>
  <p>1200<em>条评论</em></p>
  <p>98%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_18">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b18.jpg"></a></aside>
  <article>
  <h6>心里大师:罪爱</h6>
  <p>¥<em>23.80</em></p>
  <p>500<em>条评论</em></p>
  <p>99%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_19">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b19.jpg"></a></aside>
  <article>
  <h6>送雏菊的姑娘</h6>
  <p>¥<em>19.50</em></p>
  <p>100<em>条评论</em></p>
  <p>98%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_20">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/book/b20.jpg"/></a></aside>
  <article>
  <h6>法医研究所</h6>
  <p>¥<em>20.00</em></p>
  <p>100<em>条评论</em></p>
  <p>90%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  </ul>
  <a href="javascript:void(0)" class="more" style="display:inline-block;width:6.4rem;height:0.6rem;line-height:0.6rem;text-align:center;font-size:0.24rem;color:#666666;">加载更多</a>
  </div>
  </div>
  <div class="noyangshi buyBtnToo">
  <a href="javascript:void(0)">购物车结算(<em>0</em>)</a>
  </div>
  <div class="endPop">
  <div class="popMain">
  <p>完成!</p>
  <p>感谢您的参与,谢谢!</p>
  <a href="javascript:void(0)" class="backHomePage">返回首页</a>
  </div>
  </div>
  <script>
   
  function getCookie(name) {
  var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   
  if(arr=document.cookie.match(reg))
  return unescape(arr[2]);
  else
  return null;
  }
  function setCookie(name,value)
  {
  var Days = 30;
  var exp = new Date();
  exp.setTime(exp.getTime() + Days*24*60*60*1000);
  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
  }
   
  var user_num = getCookie('user_num');
  if (!user_num) {
  user_num = Math.random();
  setCookie('user_num', user_num);
  }
   
   
  //随机数
  var sj_number=Math.random();
   
  //随机取出
  function getArrayItems(arr, num) {
  var temp_array = new Array();
  for (var index in arr) {
  temp_array.push(arr[index]);
  }
  var return_array = new Array();
  for (var i = 0; i<num; i++) {
  if (temp_array.length>0) {
  var arrIndex = Math.floor(Math.random()*temp_array.length);
  return_array[i] = temp_array[arrIndex];
   
  temp_array.splice(arrIndex, 1);
  } else {
  break;
  }
  }
  return return_array;
  }
   
  //高分主流
  var to_img1=[{
  "_id":1,
  "name":"消失的女孩",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/1.jpg",
  "prize":20.00,
  "comm":86000,
  "rate":97,
  },
  {
  "_id":2,
  "name":"嫌疑人x的献身",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/2.jpg",
  "prize":26.30,
  "comm":71000,
  "rate":96,
  },
  {
  "_id":3,
  "name":"白夜行",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/3.jpg",
  "prize":23.70,
  "comm":71000,
  "rate":95,
  },
  {
  "_id":4,
  "name":"余罪:我的刑侦笔记2",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/4.jpg",
  "prize":26.50,
  "comm":16000,
  "rate":96,
  },
  {
  "_id":5,
  "name":"余罪:我的刑侦笔记5",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/5.jpg",
  "prize":29.40,
  "comm":16000,
  "rate":95,
  },
  {
  "_id":6,
  "name":"藏海花",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/6.jpg",
  "prize":23.90,
  "comm":10000,
  "rate":97,
  },
  {
  "_id":7,
  "name":"虚无的十字架",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/7.jpg",
  "prize":27.40,
  "comm":9600,
  "rate":98,
  },
  {
  "_id":8,
  "name":"丹·布朗·地狱",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/8.jpg",
  "prize":32.20,
  "comm":8400,
  "rate":95,
  },
  {
  "_id":9,
  "name":"清明上河图密码2",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/9.jpg",
  "prize":34.70,
  "comm":7200,
  "rate":96,
  },
  {
  "_id":10,
  "name":"清明上河图密码3",
  "img":"//image.buslive.cn/awjdc_1222/images/top_one/10.jpg",
  "prize":38.70,
  "comm":7200,
  "rate":99,
  }
  ];
   
  //高分利基
  var tt_img1 = [{
  "_id":11,
  "name":"福尔摩斯探案大全集",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/1.jpg",
  "prize":17.40,
  "comm":4600,
  "rate":95,
  },
  {
  "_id":12,
  "name":"消失的爱人",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/2.jpg",
  "prize":31.50,
  "comm":3800,
  "rate":94,
  },
  {
  "_id":13,
  "name":"十宗罪",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/3.jpg",
  "prize":20.60,
  "comm":3400,
  "rate":98,
  },
  {
  "_id":14,
  "name":"盗墓笔记4",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/4.jpg",
  "prize":23.30,
  "comm":2400,
  "rate":96,
  },
  {
  "_id":15,
  "name":"海边的卡夫卡",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/5.jpg",
  "prize":27.80,
  "comm":2300,
  "rate":96,
  },
  {
  "_id":16,
  "name":"告白",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/6.jpg",
  "prize":25.30,
  "comm":2100,
  "rate":98,
  },
  {
  "_id":17,
  "name":"失落的秘符",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/7.jpg",
  "prize":33.20,
  "comm":1100,
  "rate":97,
  },
  {
  "_id":18,
  "name":"超杀人事件",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/8.jpg",
  "prize":18.70,
  "comm":800,
  "rate":95,
  },
  {
  "_id":19,
  "name":"玫瑰的名字",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/9.jpg",
  "prize":45.80,
  "comm":600,
  "rate":94,
  },
  {
  "_id":20,
  "name":"假如假期来临",
  "img":"//image.buslive.cn/awjdc_1222/images/top_two/10.jpg",
  "prize":27.20,
  "comm":400,
  "rate":99,
  }
  ];
   
  //低分主流
  var lo_img1 = [{
  "_id":21,
  "name":"解忧杂货店",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/1.jpg",
  "prize":27.00,
  "comm":79000,
  "rate":94,
  },
  {
  "_id":22,
  "name":"加贺探案集(4)",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/2.jpg",
  "prize":21.00,
  "comm":71000,
  "rate":93,
  },
  {
  "_id":23,
  "name":"秘密",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/3.jpg",
  "prize":23.50,
  "comm":71000,
  "rate":92,
  },
  {
  "_id":24,
  "name":"幸存者",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/4.jpg",
  "prize":24.80,
  "comm":18000,
  "rate":93,
  },
  {
  "_id":25,
  "name":"余罪:我的刑侦笔记6",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/5.jpg",
  "prize":29.00,
  "comm":16000,
  "rate":92,
  },
  {
  "_id":26,
  "name":"余罪:我的刑侦笔记3",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/6.jpg",
  "prize":26.40,
  "comm":16000,
  "rate":93,
  },
  {
  "_id":27,
  "name":"余罪:我的刑侦笔记4",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/7.jpg",
  "prize":29.00,
  "comm":16000,
  "rate":94,
  },
  {
  "_id":28,
  "name":"假面饭店",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/8.jpg",
  "prize":28.70,
  "comm":8500,
  "rate":94,
  },
  {
  "_id":29,
  "name":"假面前夜",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/9.jpg",
  "prize":24.90,
  "comm":8500,
  "rate":93,
  },
  {
  "_id":30,
  "name":"清明上河图密码",
  "img":"//image.buslive.cn/awjdc_1222/images/low_one/10.jpg",
  "prize":34.30,
  "comm":7200,
  "rate":92,
  }
  ];
   
  //低分利基
  var lt_img1 =[{
  "_id":31,
  "name":"暗算",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/1.jpg",
  "prize":38.30,
  "comm":3900,
  "rate":91,
  },
  {
  "_id":32,
  "name":"死神的精确度",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/2.jpg",
  "prize":29.50,
  "comm":3100,
  "rate":92,
  },
  {
  "_id":33,
  "name":"杀手界",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/3.jpg",
  "prize":30.60,
  "comm":3100,
  "rate":90,
  },
  {
  "_id":34,
  "name":"火车上的女孩",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/4.jpg",
  "prize":27.20,
  "comm":2300,
  "rate":92,
  },
  {
  "_id":35,
  "name":"同级生",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/5.jpg",
  "prize":23.80,
  "comm":2300,
  "rate":89,
  },
  {
  "_id":36,
  "name":"彷徨之刃",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/6.jpg",
  "prize":23.80,
  "comm":2300,
  "rate":89,
  },
  {
  "_id":37,
  "name":"邪恶催眠师3",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/7.jpg",
  "prize":26.10,
  "comm":1000,
  "rate":91,
  },
  {
  "_id":38,
  "name":"神探伽利略2",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/8.jpg",
  "prize":22.10,
  "comm":700,
  "rate":93,
  },
  {
  "_id":39,
  "name":"地下街的雨",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/9.jpg",
  "prize":19.70,
  "comm":400,
  "rate":91,
  },
  {
  "_id":40,
  "name":"怪笑小说",
  "img":"//image.buslive.cn/awjdc_1222/images/low_two/10.jpg",
  "prize":25.10,
  "comm":300,
  "rate":92,
  }
  ]
   
  // 剩余场景数 4,5,6,7,8,9,10,11,12,13,14,15
   
  var _num1 = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
  var _num2 = Math.floor(Math.random() * _num1.length);
  var _num=(_num1[_num2]);
  var scene_status=_num;
   
   
  var arr = [
  {"key1":"to_img1","value1":8,"key2":"tt_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"tt_img1","value2":2},
  {"key1":"to_img1","value1":8,"key2":"lo_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"lo_img1","value2":2},
  {"key1":"to_img1","value1":8,"key2":"lt_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"lt_img1","value2":2},
  {"key1":"tt_img1","value1":8,"key2":"lo_img1","value2":0},
  {"key1":"tt_img1","value1":6,"key2":"lo_img1","value2":2},
  {"key1":"to_img1","value1":2,"key2":"tt_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"tt_img1","value2":8},
  {"key1":"to_img1","value1":2,"key2":"lo_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"lo_img1","value2":8},
  {"key1":"to_img1","value1":2,"key2":"lt_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"lt_img1","value2":8},
  {"key1":"tt_img1","value1":2,"key2":"lo_img1","value2":6},
  {"key1":"tt_img1","value1":0,"key2":"lo_img1","value2":8},
  ];
   
   
  var data=getArrayItems(eval(arr[_num].key1),arr[_num].value1);
  var data2=getArrayItems(eval(arr[_num].key2),arr[_num].value2);
   
   
  data_to(data);
  data_to(data2);
   
  function data_to(data){
  var html='';
  for(var i=0;i<data.length;i++){
  html+='<li id="hi_'+data[i]._id+'">\
  <aside><a href="javascript:void(0)"><img class="hotImg" src='+data[i].img+'></a></aside>\
  <article>\
  <h6>'+data[i].name+'</h6>\
  <p>¥<em>'+data[i].prize+'</em></p>\
  <p><em>'+data[i].comm+'</em>条评论</p>\
  <p><em>'+data[i].rate+'</em>%好评</p>\
  <a href="javascript:void(0)">加入购物车</a>\
  </article>\
  </li>';
  }
  $(".hotList ul").append(html);
  }
   
  // //banner
  // $(function(){
  // var swiperBanner = new Swiper('.banner', {
  // loop:true,
  // pagination:".bannerSum"
  // });
  // });
   
  $(".commonList ul li:gt(11)").hide();
  $(document).on("click",".more",function(){
  $(".commonList ul li:gt(11)").show();
  $(".more").hide();
  });
   
   
  $(function(){
  $(document).on("click",".closePop",function(){
  $(".goodsInfoPop").fadeOut(200);
  });
  $(document).on("click",".endPop .popMain .backHomePage",function(){
  location.href="index.html";
  });
   
  var goodsArrComm=[];
  var goodsArrHot=[];
  //热门推荐
  $(document).on("click",".hotList ul li aside a",function(){
  $(".goodsInfoPop").fadeIn(200);
  var _id = $(this).parent().parent('li').attr("id");
  $(".hotList ul li aside a").attr("data_id",_id);
   
  var _title=$("#" + _id).children("article").find("h6").text();
  var _info1=$("#"+_id).children("article").children("p:eq(0)").find("em").text();
  var _info2=$("#"+_id).children("article").children("p:eq(1)").find("em").text();
  var _info3=$("#"+_id).children("article").children("p:eq(2)").find("em").text();
  var _src=$("#"+_id).children("aside").find("a img").attr("src");
   
  $(".goodsInfoPop .mainInfo h3").html(_title);
  $(".goodsInfoPop .mainInfo article p:eq(0) em").html(_info1);
  $(".goodsInfoPop .mainInfo article p:eq(1) em").html(_info2);
  $(".goodsInfoPop .mainInfo article p:eq(2) em").html(_info3);
  $(".goodsInfoPop .mainInfo aside img").attr("src",_src);
  });
  $(document).on("click",".hotList ul li article a",function(){
  var _id = $(this).parent().parent('li').attr("id");
  var _this = $(this).attr("data_id",_id);
   
  if($(_this).hasClass("removeS")){
  $("#"+_id).children("article").find("a").css("background","#ff5a11");
  $("#"+_id).children("article").find("a").removeClass("removeS").html("加入购物车");
   
  var t_name= $("#"+_id).children("article").find("h6").text();
   
  var b_n = goodsArrHot.indexOf(t_name);
  goodsArrHot.splice(b_n, 1);
   
  console.log(goodsArrHot);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n-1);
  $(".noyangshi a em").html(n);
  if(n<5){
  $(".noyangshi a").css("background-color","#666666").parent("div").removeClass("buyBtn").addClass("buyBtnToo");
  }
  }else{
  $("#"+_id).children("article").find("a").addClass("removeS").html("移除购物车");
  $("#"+_id).children("article").find("a").css("background","#666666");
   
  var hb_name = $("#"+_id).children("article").find("h6").text();
  goodsArrHot.push(hb_name);
  console.log(goodsArrHot);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n+1);
  if(n > 4){
  $(".noyangshi a").css("background-color","#ff5a11").parent('div').addClass("buyBtn");
  }
  $(".noyangshi a em").html(n);
   
  }
  });
   
   
   
  // //点击图片显示详细信息
  // $(document).on("click",".commonList ul li aside a",function(){
  // $(".goodsInfoPop").fadeIn(200);
  // var _id = $(this).parent().parent('li').attr("id");
  // $(".commonList ul li aside a").attr("data_id",_id);
   
  // var _title=$("#" + _id).children("article").find("h6").text();
  // var _info1=$("#"+_id).children("article").children("p:eq(0)").find("em").text();
  // var _info2=$("#"+_id).children("article").children("p:eq(1)").find("em").text();
  // var _info3=$("#"+_id).children("article").children("p:eq(2)").find("em").text();
  // var _src=$("#"+_id).children("aside").find("a img").attr("src");
   
  // $(".goodsInfoPop .mainInfo h3").html(_title);
  // $(".goodsInfoPop .mainInfo article p:eq(0) em").html(_info1);
  // $(".goodsInfoPop .mainInfo article p:eq(1) em").html(_info2);
  // $(".goodsInfoPop .mainInfo article p:eq(2) em").html(_info3);
  // $(".goodsInfoPop .mainInfo aside img").attr("src",_src);
  // });
   
  //加入购物车
  $(document).on("click",".commonList ul li article a",function(){
  var _id = $(this).parent().parent('li').attr("id");
  var _this = $(this).attr("data_id",_id);
   
  if($(_this).hasClass("removeS")){
  $("#"+_id).children("article").find("a").css("background","#ff5a11");
  $("#"+_id).children("article").find("a").removeClass("removeS").html("加入购物车");
   
  var ct_name= $("#"+_id).children("article").find("h6").text();
   
  var arrIndex = Math.floor(Math.random()*goodsArrComm.length);
  var cb_n = goodsArrComm.indexOf(ct_name);
   
  goodsArrComm.splice(cb_n, 1);
  console.log(goodsArrComm);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n-1);
  $(".noyangshi a em").html(n);
  if(n<5){
  $(".noyangshi a").css("background-color","#666666").parent("div").removeClass("buyBtn").addClass("buyBtnToo");
  }
  }else{
  $("#"+_id).children("article").find("a").addClass("removeS").html("移除购物车");
  $("#"+_id).children("article").find("a").css("background","#666666");
   
  var b_name = $("#"+_id).children("article").find("h6").text();
   
  goodsArrComm.push(b_name);
  console.log(goodsArrComm);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n+1);
  if(n > 4){
  $(".noyangshi a").css("background-color","#ff5a11").parent('div').addClass("buyBtn");
  }
  $(".noyangshi a em").html(n);
  }
  });
   
   
  //存储数据
  $(document).on("click",".buyBtn a",function(){
  var user_num_data = getCookie('user_num');
  var scene_status=_num;
  var sj_Number = Math.random();
  var cut_sj_Number = (sj_number.toString().substring(2));
  var cut_user_num_data = (user_num_data.substring(2));
  AV.initialize('WVcpwOApF0G5SMl5kr2dLfhW-gzGzoHsz', 'pB6JnQf7i8l4RkShabUT4bWl');
  var books = AV.Object.extend('books');
  var testObject = new books();
   
  testObject.save({
  booksNameHot : goodsArrHot,
  booksNameComm : goodsArrComm,
  SJ_Number : cut_sj_Number,
  user_num : cut_user_num_data,
  scene_status_num : scene_status
  }, {
  success: function(object) {
  location.href="end.html";
  }
  }, function(error) {
  alert(error);
  });
  })
  });
   
   
  </script>
  </body>
  <script>
  var _hmt = _hmt || [];
  (function() {
  var hm = document.createElement("script");
  hm.src = "//hm.baidu.com/hm.js?818abfb5827257869fc349f7a2be4c29";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
  })();
  </script>
   
  </html>

实验模型2:

  <!DOCTYPE HTML>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1, maximum-scale=1,user-scalable=no" />
  <meta name="format-detection" content="telephone=no">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="blank" />
  <title>鼠标</title>
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/base.css">
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/mouse.css">
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/fontSize.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/jquery-1.10.2.min.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/function.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-mini-0.6.4.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-core-mini-0.6.4.js"></script>
  </head>
  <body>
  <div class="listBox" style="height:9.5rem;overflow:auto;">
  <!-- <div class="banner">
  <ul class="swiper-wrapper">
  <li class="swiper-slide"><a href=""><img src="//image.buslive.cn/awjdc_1222/images/mouse_swiper/b1.jpg"></a></li>
  <li class="swiper-slide"><a href=""><img src="//image.buslive.cn/awjdc_1222/images/mouse_swiper/b2.jpg"></a></li>
  <li class="swiper-slide"><a href=""><img src="//image.buslive.cn/awjdc_1222/images/mouse_swiper/b3.jpg"></a></li>
  <li class="swiper-slide"><a href=""><img src="//image.buslive.cn/awjdc_1222/images/mouse_swiper/b4.jpg"></a></li>
  <li class="swiper-slide"><a href=""><img src="//image.buslive.cn/awjdc_1222/images/mouse_swiper/b5.jpg"></a></li>
  </ul>
  <div class="bannerSum"></div>
  </div> -->
   
  <div class="hotList">
  <h3>热门推荐</h3>
  <ul></ul>
  </div>
  <div class="commonList">
  <h3>商品列表</h3>
  <ul>
  <li id="img_1">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s1.jpg"></a></aside>
  <article>
  <h6>罗技M185鼠标</h6>
  <p>¥<em>69.00</em></p>
  <p>130000<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_2">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s2.jpg"></a></aside>
  <article>
  <h6>华硕UX300鼠标</h6>
  <p>¥<em>39.90</em></p>
  <p>115000<em>条评论</em></p>
  <p>92%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_3">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s3.jpg"></a></aside>
  <article>
  <h6>罗技M185鼠标</h6>
  <p>¥<em>69.00</em></p>
  <p>110000<em>条评论</em></p>
  <p>95%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_4">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s4.jpg"></a></aside>
  <article>
  <h6>罗技M105鼠标</h6>
  <p>¥<em>49.00</em></p>
  <p>95000<em>条评论</em></p>
  <p>90%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_5">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s5.jpg"></a></aside>
  <article>
  <h6>双飞燕N-810FX针光鼠</h6>
  <p>¥<em>49.00</em></p>
  <p>70000<em>条评论</em></p>
  <p>96%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_6">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s6.jpg"></a></aside>
  <article>
  <h6>双飞燕OP-550NU针光鼠</h6>
  <p>¥<em>38.00</em></p>
  <p>50000<em>条评论</em></p>
  <p>97%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_7">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s7.jpg"></a></aside>
  <article>
  <h6>联想M120大红点</h6>
  <p>¥<em>39.00</em></p>
  <p>38000<em>条评论</em></p>
  <p>94%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_8">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s8.jpg"></a></aside>
  <article>
  <h6>罗技B175商用</h6>
  <p>¥<em>79.00</em></p>
  <p>29000<em>条评论</em></p>
  <p>93%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_9">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s9.jpg"></a></aside>
  <article>
  <h6>富勒M65节能</h6>
  <p>¥<em>29.90</em></p>
  <p>27000<em>条评论</em></p>
  <p>94%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_10">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s10.jpg"></a></aside>
  <article>
  <h6>Thinkpad OB47161无线</h6>
  <p>¥<em>99.00</em></p>
  <p>24000<em>条好评</em></p>
  <p>97%<em>评论</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_11">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s11.jpg"></a></aside>
  <article>
  <h6>讯拓幽灵A310激光</h6>
  <p>¥<em>69.90</em></p>
  <p>10100<em>条评论</em></p>
  <p>91%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_12">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s12.jpg"></a></aside>
  <article>
  <h6>雷柏3500P无线光学</h6>
  <p>¥<em>69.00</em></p>
  <p>10000<em>条评论</em></p>
  <p>97%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_13">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s13.jpg"></a></aside>
  <article>
  <h6>雷柏 M350无线</h6>
  <p>¥<em>69.00</em></p>
  <p>8500<em>条评论</em></p>
  <p>94%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_14">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s14.jpg"></a></aside>
  <article>
  <h6>现代HY-G35有线发光</h6>
  <p>¥<em>29.00</em></p>
  <p>6800<em>条评论</em></p>
  <p>92%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_15">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s15.jpg"></a></aside>
  <article>
  <h6>摩豹G608静音</h6>
  <p>¥<em>29.90</em></p>
  <p>5400<em>条评论</em></p>
  <p>95%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_16">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s16.jpg"></a></aside>
  <article>
  <h6>摩天手G52无线</h6>
  <p>¥<em>29.90</em></p>
  <p>4600<em>条评论</em></p>
  <p>93%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_17">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s17.jpg"></a></aside>
  <article>
  <h6>航世A10蓝牙</h6>
  <p>¥<em>49.00</em></p>
  <p>3400<em>条评论</em></p>
  <p>90%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_18">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s18.jpg"></a></aside>
  <article>
  <h6>得力3715 USB有线</h6>
  <p>¥<em>29.00</em></p>
  <p>2400<em>条评论</em></p>
  <p>98%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_19">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s19.jpg"></a></aside>
  <article>
  <h6>多彩M612 青锋鲨</h6>
  <p>¥<em>99.00</em></p>
  <p>400<em>条评论</em></p>
  <p>88%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
  <li id="img_20">
  <aside><a href="javascript:void(0)"><img src="//image.buslive.cn/awjdc_1222/images/mouse/s20.jpg"></a></aside>
  <article>
  <h6>飞利浦 SPK7101</h6>
  <p>¥<em>29.90</em></p>
  <p>200<em>条评论</em></p>
  <p>99%<em>好评</em></p>
  <a href="javascript:void(0)">加入购物车</a>
  </article>
  </li>
   
  </ul>
  <a href="javascript:void(0)" class="more" style="display:inline-block;width:6.4rem;height:0.6rem;line-height:0.6rem;text-align:center;font-size:0.24rem;color:#666666;">加载更多</a>
  </div>
  </div>
  <div class="noyangshi buyBtnToo">
  <a href="javascript:void(0)">购物车结算(<em>0</em>)</a>
  </div>
  <div class="endPop">
  <div class="popMain">
  <p>完成!</p>
  <p>感谢您的参与,谢谢!</p>
  <a href="javascript:void(0)" class="backHomePage">返回首页</a>
  </div>
  </div>
  <script>
  function getCookie(name) {
  var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   
  if(arr=document.cookie.match(reg))
  return unescape(arr[2]);
  else
  return null;
  }
  function setCookie(name,value)
  {
  var Days = 30;
  var exp = new Date();
  exp.setTime(exp.getTime() + Days*24*60*60*1000);
  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
  }
   
  var user_num = getCookie('user_num');
  if (!user_num) {
  user_num = Math.random();
  setCookie('user_num', user_num);
  }
   
  //随机数
  var sj_number=Math.random();
   
  //随机取出
  //从一个随机数组arr中取出num个不同的数
  function getArrayItems(arr, num) {
   
  var temp_array = new Array();
  for (var index in arr) {
  temp_array.push(arr[index]);
  }
  var return_array = new Array();
  for (var i = 0; i<num; i++) {
  if (temp_array.length>0) {
  var arrIndex = Math.floor(Math.random()*temp_array.length);
  return_array[i] = temp_array[arrIndex];
   
  temp_array.splice(arrIndex, 1);
  } else {
  break;
  }
  }
  return return_array;
  }
   
  //高分主流
  var to_img1=[{
  "_id":1,
  "name":"雷柏M218鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/1.jpg",
  "prize":34.80,
  "comm":200000,
  "rate":97,
  },
  {
  "_id":2,
  "name":"罗技M100r鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/2.jpg",
  "prize":49.00,
  "comm":190000,
  "rate":96,
  },
  {
  "_id":3,
  "name":"双飞燕WM-100针光鼠",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/3.jpg",
  "prize":29.90,
  "comm":150000,
  "rate":96,
  },
  {
  "_id":4,
  "name":"罗技M185鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/4.jpg",
  "prize":69.60,
  "comm":240000,
  "rate":95,
  },
  {
  "_id":5,
  "name":"罗技M90鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/5.jpg",
  "prize":35.50,
  "comm":150000,
  "rate":95,
  },
  {
  "_id":6,
  "name":"雷柏M218鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/6.jpg",
  "prize":34.80,
  "comm":130000,
  "rate":97,
  },
  {
  "_id":7,
  "name":"罗技M275鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/7.jpg",
  "prize":85.00,
  "comm":110000,
  "rate":97,
  },
  {
  "_id":8,
  "name":"罗技M100r鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/8.jpg",
  "prize":49.00,
  "comm":66000,
  "rate":96,
  },
  {
  "_id":9,
  "name":"罗技M275鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/9.jpg",
  "prize":99.00,
  "comm":30000,
  "rate":97,
  },
  {
  "_id":10,
  "name":"雷柏M130鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_zhu/10.jpg",
  "prize":29.90,
  "comm":26000,
  "rate":96,
  }
  ];
   
  //高分利基
  var tt_img1 = [{
  "_id":11,
  "name":"双飞燕OP—520NU针光鼠",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/1.jpg",
  "prize":36.00,
  "comm":18000,
  "rate":97,
  },
  {
  "_id":12,
  "name":"讯拓风行指A231鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/2.jpg",
  "prize":19.90,
  "comm":17000,
  "rate":95,
  },
  {
  "_id":13,
  "name":"dostyle MD102鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/3.jpg",
  "prize":25.00,
  "comm":16000,
  "rate":96,
  },
  {
  "_id":14,
  "name":"Thinkpad 0B47151鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/4.jpg",
  "prize":69.00,
  "comm":9600,
  "rate":94,
  },
  {
  "_id":15,
  "name":"新贵追风豹010鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/5.jpg",
  "prize":13.90,
  "comm":5800,
  "rate":97,
  },
  {
  "_id":16,
  "name":"联想N1901A鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/6.jpg",
  "prize":49.00,
  "comm":4900,
  "rate":98,
  },
  {
  "_id":17,
  "name":"雷柏V19鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/7.jpg",
  "prize":79.00,
  "comm":1800,
  "rate":96,
  },
  {
  "_id":18,
  "name":"罗技M280鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/8.jpg",
  "prize":99.00,
  "comm":1400,
  "rate":97,
  },
  {
  "_id":19,
  "name":"宜博M109鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/9.jpg",
  "prize":49.00,
  "comm":700,
  "rate":95,
  },
  {
  "_id":20,
  "name":"新贵N107鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/gao_li/10.jpg",
  "prize":89.00,
  "comm":400,
  "rate":99,
  }
  ];
   
  //低分主流
  var lo_img1 = [{
  "_id":21,
  "name":"dostyle MD201鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/1.jpg",
  "prize":99.00,
  "comm":180000,
  "rate":93,
  },
  {
  "_id":22,
  "name":"大尺寸办公鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/2.jpg",
  "prize":35.00,
  "comm":150000,
  "rate":94,
  },
  {
  "_id":23,
  "name":"现代HY-N11鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/3.jpg",
  "prize":34.90,
  "comm":74000,
  "rate":90,
  },
  {
  "_id":24,
  "name":"现代M106鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/4.jpg",
  "prize":19.90,
  "comm":41000,
  "rate":93,
  },
  {
  "_id":25,
  "name":"讯拓幽灵蜂X7鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/5.jpg",
  "prize":29.90,
  "comm":42000,
  "rate":93,
  },
  {
  "_id":26,
  "name":"罗技G90鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/6.jpg",
  "prize":99.00,
  "comm":31000,
  "rate":94,
  },
  {
  "_id":27,
  "name":"微软鼠标3000V2.0",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/7.jpg",
  "prize":79.00,
  "comm":40000,
  "rate":94,
  },
  {
  "_id":28,
  "name":"达尔优执法鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/8.jpg",
  "prize":68.90,
  "comm":27000,
  "rate":92,
  },
  {
  "_id":29,
  "name":"雷柏M310 Nano鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/9.jpg",
  "prize":49.90,
  "comm":63000,
  "rate":94,
  },
  {
  "_id":30,
  "name":"达尔优G60鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_zhu/10.jpg",
  "prize":139.00,
  "comm":53000,
  "rate":93,
  }
  ];
   
  //低分利基
  var lt_img1 =[{
  "_id":31,
  "name":"现代HY—N271200DPI鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/1.jpg",
  "prize":39.90,
  "comm":14000,
  "rate":88,
  },
  {
  "_id":32,
  "name":"摩豹F60鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/2.jpg",
  "prize":29.90,
  "comm":11000,
  "rate":91,
  },
  {
  "_id":33,
  "name":"摩天手G52无线",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/3.jpg",
  "prize":69.90,
  "comm":6800,
  "rate":93,
  },
  {
  "_id":34,
  "name":"富勒X100鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/4.jpg",
  "prize":99.00,
  "comm":4000,
  "rate":92,
  },
  {
  "_id":35,
  "name":"幽灵骑士XM—502B鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/5.jpg",
  "prize":19.00,
  "comm":3700,
  "rate":90,
  },
  {
  "_id":36,
  "name":"现代NY—N16鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/6.jpg",
  "prize":29.90,
  "comm":3100,
  "rate":93,
  },
  {
  "_id":37,
  "name":"新贵E500鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/7.jpg",
  "prize":39.00,
  "comm":1600,
  "rate":90,
  },
  {
  "_id":38,
  "name":"新贵钢铁侠鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/8.jpg",
  "prize":36.90,
  "comm":1000,
  "rate":92,
  },
  {
  "_id":39,
  "name":"讯拓幽灵蜂X9鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/9.jpg",
  "prize":69.00,
  "comm":900,
  "rate":91,
  },
  {
  "_id":40,
  "name":"新贵多色糖果鼠标",
  "img":"//image.buslive.cn/awjdc_1222/images/di_li/10.jpg",
  "prize":29.90,
  "comm":700,
  "rate":90,
  }
  ]
   
  // 剩余场景数 4,5,6,7,8,9,10,11,12,13,14,15
   
  var _num1 = [0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15];
  var _num2 = Math.floor(Math.random() * _num1.length);
  var _num=(_num1[_num2]);
  var scene_status=_num;
   
   
  var arr = [
  {"key1":"to_img1","value1":8,"key2":"tt_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"tt_img1","value2":2},
  {"key1":"to_img1","value1":8,"key2":"lo_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"lo_img1","value2":2},
  {"key1":"to_img1","value1":8,"key2":"lt_img1","value2":0},
  {"key1":"to_img1","value1":6,"key2":"lt_img1","value2":2},
  {"key1":"tt_img1","value1":8,"key2":"lo_img1","value2":0},
  {"key1":"tt_img1","value1":6,"key2":"lo_img1","value2":2},
  {"key1":"to_img1","value1":2,"key2":"tt_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"tt_img1","value2":8},
  {"key1":"to_img1","value1":2,"key2":"lo_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"lo_img1","value2":8},
  {"key1":"to_img1","value1":2,"key2":"lt_img1","value2":6},
  {"key1":"to_img1","value1":0,"key2":"lt_img1","value2":8},
  {"key1":"tt_img1","value1":2,"key2":"lo_img1","value2":6},
  {"key1":"tt_img1","value1":0,"key2":"lo_img1","value2":8},
  ];
   
   
  var data=getArrayItems(eval(arr[_num].key1),arr[_num].value1);
  var data2=getArrayItems(eval(arr[_num].key2),arr[_num].value2);
   
  data_to(data);
  data_to(data2);
   
  function data_to(data){
  var html='';
  for(var i=0;i<data.length;i++){
  html+='<li id="hi_'+data[i]._id+'">\
  <aside><a href="javascript:void(0)"><img class="hotImg" src='+data[i].img+'></a></aside>\
  <article>\
  <h6>'+data[i].name+'</h6>\
  <p>¥<em>'+data[i].prize+'</em></p>\
  <p><em>'+data[i].comm+'</em>条评论</p>\
  <p><em>'+data[i].rate+'</em>%好评</p>\
  <a href="javascript:void(0)">加入购物车</a>\
  </article>\
  </li>';
  }
  $(".hotList ul").append(html);
  }
   
  // $(function(){
  // var swiperBanner = new Swiper('.banner', {
  // loop:true,
  // pagination:".bannerSum"
  // });
  // });
   
  $(".commonList ul li:gt(11)").hide();
  $(document).on("click",".more",function(){
  $(".commonList ul li:gt(11)").show();
  $(".more").hide();
  });
   
   
   
  $(function(){
  $(document).on("click",".closePop",function(){
  $(".goodsInfoPop").fadeOut(200);
  });
  $(document).on("click",".endPop .popMain .backHomePage",function(){
  location.href="index.html";
  });
   
   
  var goodsArrComm=[];
  var goodsArrHot=[];
   
  //热门推荐
  $(document).on("click",".hotList ul li aside a",function(){
  $(".goodsInfoPop").fadeIn(200);
  var _id = $(this).parent().parent('li').attr("id");
  $(".hotList ul li aside a").attr("data_id",_id);
   
  var _title=$("#" + _id).children("article").find("h6").text();
  var _info1=$("#"+_id).children("article").children("p:eq(0)").find("em").text();
  var _info2=$("#"+_id).children("article").children("p:eq(1)").find("em").text();
  var _info3=$("#"+_id).children("article").children("p:eq(2)").find("em").text();
  var _src=$("#"+_id).children("aside").find("a img").attr("src");
   
  $(".goodsInfoPop .mainInfo h3").html(_title);
  $(".goodsInfoPop .mainInfo article p:eq(0) em").html(_info1);
  $(".goodsInfoPop .mainInfo article p:eq(1) em").html(_info2);
  $(".goodsInfoPop .mainInfo article p:eq(2) em").html(_info3);
  $(".goodsInfoPop .mainInfo aside img").attr("src",_src);
  });
  $(document).on("click",".hotList ul li article a",function(){
  var _id = $(this).parent().parent('li').attr("id");
  var _this = $(this).attr("data_id",_id);
   
  if($(_this).hasClass("removeS")){
  $("#"+_id).children("article").find("a").css("background","#ff5a11");
  $("#"+_id).children("article").find("a").removeClass("removeS").html("加入购物车");
   
  var t_name= $("#"+_id).children("article").find("h6").text();
   
  var arrIndex = Math.floor(Math.random()*goodsArrHot.length);
  var b_n = goodsArrHot.indexOf(t_name);
  // console.log(b_n);
   
  goodsArrHot.splice(b_n, 1);
   
  console.log(goodsArrHot);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n-1);
  $(".noyangshi a em").html(n);
  if(n<5){
  $(".noyangshi a").css("background-color","#666666").parent("div").removeClass("buyBtn").addClass("buyBtnToo");
  }
  }else{
  $("#"+_id).children("article").find("a").addClass("removeS").html("移除购物车");
  $("#"+_id).children("article").find("a").css("background","#666666");
   
  var hb_name = $("#"+_id).children("article").find("h6").text();
  goodsArrHot.push(hb_name);
  console.log(goodsArrHot);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n+1);
  if(n > 4){
  $(".noyangshi a").css("background-color","#ff5a11").parent('div').addClass("buyBtn");
  }
  $(".noyangshi a em").html(n);
   
  }
  });
   
   
   
  // //点击图片显示详细信息
  // $(document).on("click",".commonList ul li aside a",function(){
  // $(".goodsInfoPop").fadeIn(200);
  // var _id = $(this).parent().parent('li').attr("id");
  // $(".commonList ul li aside a").attr("data_id",_id);
   
  // var _title=$("#" + _id).children("article").find("h6").text();
  // var _info1=$("#"+_id).children("article").children("p:eq(0)").find("em").text();
  // var _info2=$("#"+_id).children("article").children("p:eq(1)").find("em").text();
  // var _info3=$("#"+_id).children("article").children("p:eq(2)").find("em").text();
  // var _src=$("#"+_id).children("aside").find("a img").attr("src");
   
  // $(".goodsInfoPop .mainInfo h3").html(_title);
  // $(".goodsInfoPop .mainInfo article p:eq(0) em").html(_info1);
  // $(".goodsInfoPop .mainInfo article p:eq(1) em").html(_info2);
  // $(".goodsInfoPop .mainInfo article p:eq(2) em").html(_info3);
  // $(".goodsInfoPop .mainInfo aside img").attr("src",_src);
  // });
   
  //加入购物车
  $(document).on("click",".commonList ul li article a",function(){
  var _id = $(this).parent().parent('li').attr("id");
  var _this = $(this).attr("data_id",_id);
   
  if($(_this).hasClass("removeS")){
  $("#"+_id).children("article").find("a").css("background","#ff5a11");
  $("#"+_id).children("article").find("a").removeClass("removeS").html("加入购物车");
   
  var ct_name= $("#"+_id).children("article").find("h6").text();
   
  var arrIndex = Math.floor(Math.random()*goodsArrComm.length);
  var cb_n = goodsArrComm.indexOf(ct_name);
   
  goodsArrComm.splice(cb_n, 1);
  console.log(goodsArrComm);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n-1);
  $(".noyangshi a em").html(n);
  if(n<5){
  $(".noyangshi a").css("background-color","#666666").parent("div").removeClass("buyBtn").addClass("buyBtnToo");
  }
  }else{
  $("#"+_id).children("article").find("a").addClass("removeS").html("移除购物车");
  $("#"+_id).children("article").find("a").css("background","#666666");
   
  var b_name = $("#"+_id).children("article").find("h6").text();
  goodsArrComm.push(b_name);
  console.log(goodsArrComm);
   
  var n = parseInt($(".noyangshi a em").text());
  n=(n+1);
  if(n > 4){
  $(".noyangshi a").css("background-color","#ff5a11").parent('div').addClass("buyBtn");
  }
  $(".noyangshi a em").html(n);
   
  }
  });
   
   
  //存储页面数据
  $(document).on("click",".buyBtn a",function(){
  var user_num_data = getCookie('user_num');
  var sj_Number = Math.random();
  var scene_status=_num;
  var cut_sj_Number = (sj_number.toString().substring(2));
  var cut_user_num_data = (user_num_data.substring(2));
  AV.initialize('WVcpwOApF0G5SMl5kr2dLfhW-gzGzoHsz', 'pB6JnQf7i8l4RkShabUT4bWl');
  var mouses = AV.Object.extend('mouses');
  var testObject = new mouses();
   
  testObject.save({
  mousesNameHot : goodsArrHot,
  mousesNameComm : goodsArrComm,
  SJ_Number : cut_sj_Number,
  user_num : cut_user_num_data,
  scene_status_num : scene_status
  }, {
  success: function(object) {
  location.href="end.html";
  }
  }, function(error) {
  alert(error);
  });
  })
  });
   
  </script>
  </body>
  <script>
  var _hmt = _hmt || [];
  (function() {
  var hm = document.createElement("script");
  hm.src = "//hm.baidu.com/hm.js?818abfb5827257869fc349f7a2be4c29";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
  })();
  </script>
   
  </html>

尾页,结束页:

1.获取用户购买商品的cookie‘ id,保持身份一致,增加调查数据的准确性

2.尾页实验调查,增加用户体验,增加实验调查数据的可靠性,多样性,对搜集数组的分析总结提供参考

3。搜集数据,匹配用户身份,存储服务器。

  <!DOCTYPE HTML>
  <html>
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1, maximum-scale=1,user-scalable=no" />
  <meta name="format-detection" content="telephone=no">
  <meta name="apple-mobile-web-app-capable" content="yes" />
  <meta name="apple-mobile-web-app-status-bar-style" content="blank" />
  <title>调查</title>
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/base.css">
  <link type="text/css" rel="stylesheet" href="//image.buslive.cn/awjdc_1222/css/end.css">
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/fontSize.js"></script>
  <script type="text/javascript" src="//image.buslive.cn/awjdc_1222/js/jquery-1.10.2.min.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-mini-0.6.4.js"></script>
  <script src="//image.buslive.cn/ynyd/js/av-core-mini-0.6.4.js"></script>
  </head>
  <body>
  <ul class="cardList">
  <li>
  <h3>1.您的性别</h3>
  <p><a href="javascript:void(0)" class="sex" data="男"><span>男</span></a></p>
  <p><a href="javascript:void(0)" class="sex" data="女"><span>女</span></a></p>
  </li>
  <li>
  <h3>2.您的年龄</h3>
  <p><a href="javascript:void(0)" class="age" data="20岁以下"><span>20岁以下</span></a></p>
  <p><a href="javascript:void(0)" class="age" data="20-25岁"><span>20-25岁</span></a></p>
  <p><a href="javascript:void(0)" class="age" data="26-30岁"><span>26-30岁</span></a></p>
  <p><a href="javascript:void(0)" class="age" data="30岁以上"><span>30岁以上</span></a></p>
  </li>
  <li>
  <h3>3.您平均多长时间进行一次网络购物</h3>
  <p><a href="javascript:void(0)" class="time" data="每月4次以上"><span>每月4次以上</span></a></p>
  <p><a href="javascript:void(0)" class="time" data="每月1-4次"><span>每月1-4次</span></a></p>
  <p><a href="javascript:void(0)" class="time" data="每季度1-2次"><span>每季度1-2次</span></a></p>
  <p><a href="javascript:void(0)" class="time" data="没季度不到1次"><span>每季度不到1次</span></a></p>
  </li>
  <!-- <li style="height:3.5rem;">
  <h3>5.您平时在网络购物过程中,最关注产品的哪些信息呢?(请至少回答两种,用逗号分隔)</h3>
  <textarea name="" class="comm"></textarea>
  </li> -->
  <li>
  <h3>4.您平时在网络购物过程中,最关注产品的哪些信息(多选)?</h3>
  <p><a href="javascript:void(0)" class="info" data="价格"><span>价格</span></a></p>
  <p><a href="javascript:void(0)" class="info" data="品牌"><span>品牌</span></a></p>
  <p><a href="javascript:void(0)" class="info" data="销量"><span>销量</span></a></p>
  <p><a href="javascript:void(0)" class="info" data="评分"><span>评分</span></a></p>
  <p><a href="javascript:void(0)" class="info" data="评论内容"><span>评论内容</span></a></p>
  <p><a href="javascript:void(0)" class="info" data="售后保障"><span>售后保障</span></a></p>
  </li>
  </ul>
  <div class="infoBox">
  <p><span>其他</span><input type="text" class="info_txt" value=""></p>
  </div>
  <div class="nobuy buyBtnToo">
  <a href="javascript:void(0)">提交</a>
  </div>
  <div class="endPop">
  <div class="popMain">
  <p>感谢您的配合,</p>
  <p>祝您生活愉快,谢谢!</p>
  <a href="javascript:void(0)" class="backHomePage">返回首页</a>
  </div>
  </div>
  </body>
   
  <script>
  //存 取cookie
   
  function getCookie(name) {
  var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
   
  if(arr=document.cookie.match(reg))
  return unescape(arr[2]);
  else
  return null;
  }
  function setCookie(name,value)
  {
  var Days = 30;
  var exp = new Date();
  exp.setTime(exp.getTime() + Days*24*60*60*1000);
  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
  }
   
  $(function(){
  var user_num = getCookie('user_num');
  if (!user_num) {
  user_num = Math.random();
  setCookie('user_num', user_num);
  }
   
   
  //性别
  var sex_data=0;
  $('.sex').click(function(){
  var _this=$(this);
  sex_data=_this.attr('data');
  _this.addClass('checked').parent().siblings().children().removeClass('checked');
  if(sex_data!==0&&age_data!==0&&time_data!==0&&info_arr.length!=0){
  $(".nobuy a").parent("div").addClass("toBuyBtn").removeClass("buyBtnToo");
  };
  console.log(sex_data);
  });
   
  //年龄
  var age_data=0;
  $('.age').click(function(){
  var _this=$(this);
  age_data=_this.attr('data');
  _this.addClass('checked').parent().siblings().children().removeClass('checked');
  if(sex_data!==0&&age_data!==0&&time_data!==0&&info_arr.length!=0){
  $(".nobuy a").parent("div").addClass("toBuyBtn").removeClass("buyBtnToo");
  };
  console.log(age_data);
  });
   
  //网购次数
  var time_data=0;
  $('.time').click(function(){
  var _this=$(this);
  time_data=_this.attr('data');
  _this.addClass('checked').parent().siblings().children().removeClass('checked');
  if(sex_data!==0&&age_data!==0&&time_data!==0&&info_arr.length!=0){
  $(".nobuy a").parent("div").addClass("toBuyBtn").removeClass("buyBtnToo");
  };
  console.log(time_data);
  });
   
  //关注信息
  var info_arr=[];
  $(".info").click(function(){
   
  var _this=$(this);
  if(_this.hasClass("checked")){
  _this.removeClass("checked");
  var d_d=_this.attr("data");
  var b_n = info_arr.indexOf(d_d);
  info_arr.splice(b_n, 1);
  }else{
  info_data=_this.attr("data");
  _this.addClass("checked");
  info_arr.push(info_data);
  }
   
  if(sex_data!==0&&age_data!==0&&time_data!==0&&info_arr.length!=0){
  $(".nobuy a").parent("div").addClass("toBuyBtn").removeClass("buyBtnToo");
  }
   
  console.log(info_arr);
  })
   
  // //其他
  // var info_txt_data=0;
  // $(".info_txt").keyup(function(){
  // info_txt_data=$(this).val();
  // info_arr.push(info_txt_data);
  // console.log(info_arr);
  // })
   
  // //关注
  // var comm_data=0;
  // $('.comm').keyup(function(){
  // area_comm_data=$(".comm").val();
  // if(area_comm_data.length>0){
  // comm_data=area_comm_data;
  // if(sex_data!==0&&age_data!==0&&time_data!==0&&comm_data!==0){
  // $(".nobuy a").parent("div").addClass("toBuyBtn").removeClass("buyBtnToo");
  // };
  // } else {
  // $(".nobuy a").parent("div").addClass("buyBtnToo").removeClass("toBuyBtn");
  // }
  // console.log(comm_data);
  // });
   
   
  $(document).on("click",".endPop .popMain .backHomePage",function(){
  location.href="index.html";
  });
   
  //存储数据
  $(document).on("click",".toBuyBtn a",function(){
  var otherInfo=$(".info_txt").val();
  console.log(otherInfo);
  var user_num_data = getCookie('user_num');
  var cut_user_num_data = (user_num_data.substring(2));
  AV.initialize('WVcpwOApF0G5SMl5kr2dLfhW-gzGzoHsz', 'pB6JnQf7i8l4RkShabUT4bWl');
  var user_info = AV.Object.extend('user_info');
  var testObject = new user_info();
   
  testObject.save({
  sex : sex_data,
  age : age_data,
  time : time_data,
  goods : info_arr,
  other : otherInfo,
  user_num : cut_user_num_data
  }, {
  success: function(object) {
  $(".endPop").fadeIn(100);
  }
  }, function(error) {
  alert(error);
  });
  });
   
  });
   
  </script>
  <script>
  var _hmt = _hmt || [];
  (function() {
  var hm = document.createElement("script");
  hm.src = "//hm.baidu.com/hm.js?818abfb5827257869fc349f7a2be4c29";
  var s = document.getElementsByTagName("script")[0];
  s.parentNode.insertBefore(hm, s);
  })();
  </script>
   
  </html>

个人做的一个小实验,和大家一起学习,希望大家多多指教。

转载于:https://www.cnblogs.com/skzxcwebblogs/p/9358375.html

leancloud存储,cookie缓存,实现简单实验调查购物车相关推荐

  1. php 置多条cookie,php 在cookie存储多个的简单示例

    这篇文章主要为大家详细介绍了php 在cookie存储多个的简单示例,具有一定的参考价值,可以用来参考一下. 对php在一个cookie中存储多个值得代码感兴趣的小伙伴,下面一起跟随512笔记的小编两 ...

  2. IndexedDB浏览器本地存储、缓存、数据库、介绍

    目录 1.前言 2.IndexedDB简介 3.IndexedDB使用场景 4.IndexedDB特点 4.1.非关系型数据库 NoSql 4.2.持久化存储 4.3.异步操作 4.4.支持事务 4. ...

  3. C# Azure 存储-分布式缓存Redis的新建配置查看

    C# Azure 存储-分布式缓存Redis的新建&配置&查看 1. 介绍 Redis 是一款开源的,基于 BSD 许可的,高级键值 (key-value) 缓存 (cache) 和存 ...

  4. redis学习(四) 登录和cookie缓存

    <redis实战> 第二章 1.cookie缓存用户信息的两种方式 每当我们登录互联网服务时,这些服务会使用cookie记录我们的身份 .cookie由少量数据组成,网站会要求我们浏览器存 ...

  5. 一文读懂浏览器存储与缓存机制

    浏览器存储 Cookie Cookie 是 HTTP 协议的一种无状态协议.当请求服务器时,HTTP 请求都需要携带 Cookie,用来验证用户身份.Cookie 由服务端生成,存储在客户端,用来维持 ...

  6. Web存储—本地存储Cookie

    一.Cookie存储 存在时间最久的本地存储,这种存储方式不完全脱离网络,前后台进行交互时还是需要网络 存储大小:4kb 有效期:在有效期内数据可被访问过了有效期数据消失 本地存储--本地缓存-存储在 ...

  7. liunx screen使用简单实验

    liunx screen使用 今天因工作需要使用到screen工具,感觉挺有意思,记录一下 GNU Screen是一款由GNU计划开发的用于命令行终端切换的自由软件.用户可以通过该软件同时连接多个本地 ...

  8. sFlow-rt 3.0流量监控工具安装部署及简单实验

    首先我敢说,现在网上没有谁的文章比我这篇实验记录更加全面.在做这个实验的过程中遇到了许多问题已经解决了,看了许多博客写的内容要不就是工具太落伍了,要不就是条理不清晰,要不就是省略了重要步骤,初学者看了 ...

  9. chrome cookie存在什么地方_谷歌浏览器产生的cookie缓存怎么查看呢?Cookie的具体内容在哪里...

    软件安装:谷歌浏览器 装机大全致力于收录最值得您拥有的精品应用,第一时间武装您的电脑变身电脑达人 我们将为您奉上 更贴心的分类方式:无论您喜欢音乐.视频, 还是热衷教程.资讯, 精准的分类方便您在装机 ...

最新文章

  1. 图像处理库(fbc_cv):源自OpenCV代码提取
  2. scala之Actors
  3. STL常用对象,不会搞得C++跟没学一样
  4. git命令:修改已经commit的注释
  5. 负熵主义者_未来主义者
  6. Hibernate学习(八):检索方式
  7. ctf-web-sql注入
  8. 游戏计算机性能要求,解答玩大型游戏的电脑配置
  9. c语言程序图片截取,C++实现屏幕截图功能
  10. java paypal开发详解_PayPal 开发详解(六):下载paypal立即付款SDK 并编译打包
  11. HTML5制作一个笑脸
  12. 一位高三老师写给大学生的信
  13. Python+QT+Selenium制作在线视频播放器
  14. 电脑端知乎不显示图片
  15. Prism_Commanding(2)
  16. An Actor–Critic based controller for glucose regulation in type 1 diabetes
  17. 俺常去(用)滴地方~
  18. OpenCV打开相机,调整窗口大小位置
  19. Swich case
  20. 鸿蒙开发者联盟app,开发者联盟

热门文章

  1. FEA设计器大变脸,掀门户百变风!
  2. 国际标准货币代码表你最大多少?
  3. iOS项目中一定会用到的两种常用的弹框 从底部弹出 、中间弹出 Swift代码
  4. jade学习系列之一
  5. 安全工具Burp Suite的安装及使用
  6. 计算机软考铁路不认,我报软考了
  7. 【中科蓝讯】DAC的输出方式配置
  8. 中级软考证书有什么用?
  9. 崔庆才老师爬虫原理讲解笔记
  10. 2018.12.13 jav22