1. 久久派首页
  2. 科技

苹果案例编号查询进度（apple案例进度查询）

nan • • 科技

苹果手机是目前比较火或者说是一直很火的手机，但是和人一样，人火是非多，东西也是，所以我们买苹果手机的时候都喜欢查询一下是什么时间出的，什么地方出的，但是奈何还要看很多的资料，登录这里那里去查询，有的更恶心的，还要你关注什么微信号才给你说，我也是一个果

苹果手机是目前比较火或者说是一直很火的手机，但是和人一样，人火是非多，东西也是，所以我们买苹果手机的时候都喜欢查询一下是什么时间出的，什么地方出的，但是奈何还要看很多的资料，登录这里那里去查询，有的更恶心的，还要你关注什么微信号才给你说，我也是一个果粉，所以我查看了一下苹果手机序列号的规则，决定做一个小的工具，可以直接查询手机的生产地和具体时间。今天我们就一起做一个！

效果预览：苹果案例编号查询进度（apple案例进度查询）

效果预览

我们简单的将思路说一下：

首先要知道怎么实现这个，要明白的是，苹果手机的序列号是按照什么规则排布的，

规则是：第一位字母：以 C 开头为深圳，以 D 开头为成都，以 F 开头为郑州

序列号的第四位代表生产年份，用 20 个字母表示(26 个字母中除去 A、B、E、I、O 和 U)，注意是以每半年一进位。其中，M 代表 2014 年上半年，N 代表 2014 年下半年，P 代表 2015 年上半年，Q 代表 2015 年下半年，以此类推。

序列号的第五位是用数字(即 1 到 9，除去 0)和字母(26 个字母中除去 A、B、E、I、O、U、S 和 Z)来表示的，共 27 个，代表周数，从 1 开始，数完数字数字母，每半年一循环。比如 N1 和 N9 这两个序列号分别代表 2014 年下半年第一周和第九周生产。

需要注意的是，1 到 9 分别代表第 1 到第 9 周，接下来就是 C，代表第 10 周，以此类推。

这是他的规则，这里需要明确的一点是，他是以半年为一个区间，那么序号的第五位也是半年为一个区间，所以这里首先要判断是上半年还是下半年，然后再去判断具体的日期。

不BB了，看代码，很简单：

CSS：

*{margin:0;padding:0;list-style-type:none;}
a,img{border:0;}
body{
background: #000;
color: #DDD;
font-family: \’Helvetica\’, \’Lucida Grande\’, \’Arial\’, sans-serif;
}
.border,.rain{
width: 320px;
}

.rain{
padding: 10px 12px 12px 10px;
-moz-box-shadow: 10px 10px 10px rgba(0,0,0,1) inset, -9px -9px 8px rgba(0,0,0,1) inset;
-webkit-box-shadow: 8px 8px 8px rgba(0,0,0,1) inset, -9px -9px 8px rgba(0,0,0,1) inset;
box-shadow: 8px 8px 8px rgba(0,0,0,1) inset, -9px -9px 8px rgba(0,0,0,1) inset;
margin: 100px auto;
}

.border{
padding: 1px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}

.border,
.rain,
.border.start,
.rain.start{
background-repeat: repeat-x, repeat-x, repeat-x, repeat-x;
background-position: 0 0, 0 0, 0 0, 0 0;

background-image: -moz-linear-gradient(left, #09BA5E 0%, #00C7CE 15%, #3472CF 26%, #00C7CE 48%, #0CCF91 91%, #09BA5E 100%);

background-image: -webkit-gradient(linear, left top, right top, color-stop(1%,rgba(0,0,0,.3)), color-stop(23%,rgba(0,0,0,.1)), color-stop(40%,rgba(255,231,87,.1)), color-stop(61%,rgba(255,231,87,.2)), color-stop(70%,rgba(255,231,87,.1)), color-stop(80%,rgba(0,0,0,.1)), color-stop(100%,rgba(0,0,0,.25)));

background-color: #39f;

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=\’#00BA1B\’, endColorstr=\’#00BA1B\’,GradientType=1 );
}

.border.end,
.rain.end{
-moz-transition-property: background-position;
-moz-transition-duration: 30s;
-moz-transition-timing-function: linear;
-webkit-transition-property: background-position;
-webkit-transition-duration: 30s;
-webkit-transition-timing-function: linear;
-o-transition-property: background-position;
-o-transition-duration: 30s;
-o-transition-timing-function: linear;
transition-property: background-position;
transition-duration: 30s;
transition-timing-function: linear;
background-position: -5400px 0, -4600px 0, -3800px 0, -3000px 0;
}

@-webkit-keyframes colors {
0% {background-color: #39f;}
15% {background-color: #F246C9;}
30% {background-color: #4453F2;}
45% {background-color: #44F262;}
60% {background-color: #F257D4;}
75% {background-color: #EDF255;}
90% {background-color: #F20006;}
100% {background-color: #39f;}
}
.border,.rain{
-webkit-animation-direction: normal;
-webkit-animation-duration: 20s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-name: colors;
-webkit-animation-timing-function: ease;
}

.border.unfocus{
background: #333 !important;
-moz-box-shadow: 0px 0px 15px rgba(255,255,255,.2);
-webkit-box-shadow: 0px 0px 15px rgba(255,255,255,.2);
box-shadow: 0px 0px 15px rgba(255,255,255,.2);
-webkit-animation-name: none;
}
.rain.unfocus{
background: #000 !important;
-webkit-animation-name: none;
}

form{
background: #212121;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
height:220px;
width: 100%;
background: -moz-radial-gradient(50% 46% 90deg,circle closest-corner, #242424, #090909);
background: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 150, from(#242424), to(#090909));
}
form label{
display: block;
padding: 10px 10px 5px 15px;
font-size: 11px;
color: #777;
}
form input{
display: block;
margin: 5px 10px 10px 15px;
width: 85%;
background: #111;
-moz-box-shadow: 0px 0px 4px #000 inset;
-webkit-box-shadow: 0px 0px 4px #000 inset;
box-shadow: 0px 0px 4px #000 inset;
outline: 1px solid #333;
border: 1px solid #000;
padding: 5px;
color: #444;
font-size: 16px;
}
form input:focus{
outline: 1px solid #555;
color: #FFF;
}
input[type=\”button\”]{
color: #999;
padding: 5px 10px;
border: 1px solid #000;
font-weight: lighter;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
background: #45484d;
background: -moz-linear-gradient(top, #222 0%, #111 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#222), color-stop(100%,#111));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=\’#22222\’, endColorstr=\’#11111\’,GradientType=0 );
-moz-box-shadow: 0px 1px 1px #000, 0px 1px 0px rgba(255,255,255,.3) inset;
-webkit-box-shadow: 0px 1px 1px #000, 0px 1px 0px rgba(255,255,255,.3) inset;
box-shadow: 0px 1px 1px #000,0px 1px 0px rgba(255,255,255,.3) inset;
text-shadow: 0 1px 1px #000;
outline: none;
width:80px;
margin-top:20px;
float: left;
}

css可以不看，美观一点而已

引用：

<link rel=\”stylesheet\” type=\”text/css\” href=\”css/layui/css/layui.css\”/>
<script src=\”js/jquery.min.js\” type=\”text/javascript\” charset=\”utf-8\”></script>
<script src=\”css/layui/lay/dest/layui.all.js\” type=\”text/javascript\” charset=\”utf-8\”></script>

JS：

$(function(){
var $form_inputs = $(\’form input\’);
var $rainbow_and_border = $(\’.rain, .border\’);

$form_inputs.bind(\’focus\’, function(){
$rainbow_and_border.addClass(\’end\’).removeClass(\’unfocus start\’);
});
$form_inputs.bind(\’blur\’, function(){
$rainbow_and_border.addClass(\’unfocus start\’).removeClass(\’end\’);
});
$form_inputs.first().delay(800).queue(function(){
$(this).focus();
});
});
var address;//生产地
var years;//生产年份
var dates;//生产日期
function checkappleId(){
/* 截取到第一位字符，用来判断的是生产地址 */
var ID = $(\”#checkapple\”).val();
var apple_adress = ID.substr(0,1); //截取的是第一位的字符串，然后截取的长度是一位
/* 截取到第四位的字符，用来判断的是生产年份 */
var Year = ID.substr(3,1);
/* 截取到第五位的字符，用来判断生产日期 */
var Dateflag = ID.substr(4,1);//截取到第五位
/* 先判断是不是正确的是序列号 */
if(ID.length != 12){
layer.msg(\”序列号有误！请核对对后重新查询\”);
}
else{
if(apple_adress == \’C\’){
address = \’深圳\’;
}else if(apple_adress == \’D\’){
address = \’成都\’
}else if(apple_adress == \’F\’){
address = \’郑州\’
}else{
layer.msg(\”序列号有误！请核对对后重新查询\”);
return false;
}
console.log(\”生产地是：\”+address);
console.log(\”第四位是：\”+Year);
console.log(\”第五位是：\”+Dateflag);
if(Year == \’M\’){
years = \’2014上半年\’;
check_before(Dateflag);
}else if(Year == \’N\’){
years = \’2014下半年\’;
check_after(Dateflag);
}else if(Year == \’P\’){
years = \’2015上半年\’;
check_before(Dateflag);
}else if(Year == \’Q\’){
years = \’2015下半年\’;
check_after(Dateflag);
}else if(Year == \’R\’){
years = \’2016上半年\’;
check_before(Dateflag);
}else if(Year == \’S\’){
years = \’2016下半年\’;
check_after(Dateflag);
}else if(Year == \’T\’){
years = \’2017上半年\’;
check_before(Dateflag);
}else if(Year == \’V\’){
years = \’2017下半年\’;
check_after(Dateflag);
}else if(Year == \’W\’){
years = \’2018上半年\’;
check_before(Dateflag);
}else if(Year == \’X\’){
years = \’2018下半年\’;
check_after(Dateflag);
}else if(Year == \’Y\’){
years = \’2019上半年\’;
check_before(Dateflag);
}else if(Year == \’Z\’){
years = \’2019下半年\’;
check_after(Dateflag);
}else{
layer.msg(\”序列号有误！请核对对后重新查询\”);
return false;
}
console.log(\”年份是：\”+years);
console.log(\”日期是：\”+dates);
layer.open({
type: 1,
title:\’查询结果\’,
skin: \’layui-layer-rim\’, //加上边框
area: [\’600px\’, \’400px\’], //宽高
btn:[\’关闭\’],
content: \’您的序列号是：\’+ID+\'<br/>\’+
\’该是手机生产地是：\’+address+\'<br/>\’+
\’该是手机生产年份是：\’+years+\'<br/>\’+
\’该是手机生产日期是：\’+dates+\'<br/>\’+
\’提示：如果您查询的激活日期早于生产日期，说明您的手机是官换机！\’,
});
}
}
/* 判断的是每一年的下半年的日期 */
function check_before(Dateflag){
if(Dateflag == \’1\’){
dates = \’1月1日-1月7日\’;
}else if(Dateflag == \’2\’){
dates = \’1月8日-1月14日\’;
}else if(Dateflag == \’3\’){
dates = \’1月15日-1月21日\’;
}else if(Dateflag == \’4\’){
dates = \’1月22日-1月28日\’;
}else if(Dateflag == \’5\’){
dates = \’1月29日-2月4日\’;
}else if(Dateflag == \’6\’){
dates = \’2月5日-2月11日\’;
}else if(Dateflag == \’7\’){
dates = \’2月12日-2月18日\’;
}else if(Dateflag == \’8\’){
dates = \’2月19日-2月25日\’;
}else if(Dateflag == \’9\’){
dates = \’2月26日-3月1日\’;
}else if(Dateflag == \’C\’){
dates = \’3月2日-3月8日\’;
}else if(Dateflag == \’D\’){
dates = \’3月9日-3月15日\’;
}else if(Dateflag == \’F\’){
dates = \’3月16日-3月22日\’;
}else if(Dateflag == \’G\’){
dates = \’3月23日-3月29日\’;
}else if(Dateflag == \’H\’){
dates = \’4月30日-4月6日\’;
}else if(Dateflag == \’J\’){
dates = \’4月7日-4月13日\’;
}else if(Dateflag == \’K\’){
dates = \’4月14日-4月20日\’;
}else if(Dateflag == \’L\’){
dates = \’4月21日-4月27日\’;
}else if(Dateflag == \’M\’){
dates = \’4月28日-5月3日\’;
}else if(Dateflag == \’N\’){
dates = \’5月4日-5月10日\’;
}else if(Dateflag == \’P\’){
dates = \’5月11日-5月17日\’;
}else if(Dateflag == \’Q\’){
dates = \’5月18日-5月24日\’;
}else if(Dateflag == \’R\’){
dates = \’5月25日-6月1日\’;
}else if(Dateflag == \’T\’){
dates = \’6月2日-6月8日\’;
}else if(Dateflag == \’V\’){
dates = \’6月9日-6月15日\’;
}else if(Dateflag == \’W\’){
dates = \’6月16日-6月22日\’;
}else if(Dateflag == \’X\’){
dates = \’6月23日-6月29日\’;
}else if(Dateflag == \’Y\’){
dates = \’6月30日\’;
}else{
layer.msg(\”序列号有误！请核对对后重新查询\”);
return false;
}
}
/* 判断的是下半年具体日期 */
function check_after(Dateflag){
if(Dateflag == \’1\’){
dates = \’7月1日-7月7日\’;
}else if(Dateflag == \’2\’){
dates = \’7月8日-7月14日\’;
}else if(Dateflag == \’3\’){
dates = \’7月15日-7月21日\’;
}else if(Dateflag == \’4\’){
dates = \’7月22日-7月28日\’;
}else if(Dateflag == \’5\’){
dates = \’7月29日-8月4日\’;
}else if(Dateflag == \’6\’){
dates = \’8月5日-8月11日\’;
}else if(Dateflag == \’7\’){
dates = \’8月12日-8月18日\’;
}else if(Dateflag == \’8\’){
dates = \’8月19日-8月25日\’;
}else if(Dateflag == \’9\’){
dates = \’8月26日-9月1日\’;
}else if(Dateflag == \’C\’){
dates = \’9月2日-9月8日\’;
}else if(Dateflag == \’D\’){
dates = \’9月9日-9月15日\’;
}else if(Dateflag == \’F\’){
dates = \’9月16日-9月22日\’;
}else if(Dateflag == \’G\’){
dates = \’9月23日-9月29日\’;
}else if(Dateflag == \’H\’){
dates = \’9月30日-10月6日\’;
}else if(Dateflag == \’J\’){
dates = \’10月7日-10月13日\’;
}else if(Dateflag == \’K\’){
dates = \’10月14日-10月20日\’;
}else if(Dateflag == \’L\’){
dates = \’10月21日-10月27日\’;
}else if(Dateflag == \’M\’){
dates = \’10月28日-11月3日\’;
}else if(Dateflag == \’N\’){
dates = \’11月4日-11月10日\’;
}else if(Dateflag == \’P\’){
dates = \’11月11日-11月17日\’;
}else if(Dateflag == \’Q\’){
dates = \’11月18日-11月24日\’;
}else if(Dateflag == \’R\’){
dates = \’11月25日-12月1日\’;
}else if(Dateflag == \’T\’){
dates = \’12月2日-12月8日\’;
}else if(Dateflag == \’V\’){
dates = \’12月9日-12月15日\’;
}else if(Dateflag == \’W\’){
dates = \’12月16日-12月22日\’;
}else if(Dateflag == \’X\’){
dates = \’12月23日-12月29日\’;
}else if(Dateflag == \’Y\’){
dates = \’12月30日-12月31日\’;
}else{
layer.msg(\”序列号有误！请核对对后重新查询\”);
return false;
}
}
/*苹果的全系列产品 */
function apple_info(){
layer.open({
type: 1,
title:\’苹果全系类产品\’,
skin: \’layui-layer-rim\’, //加上边框
area: [\’600px\’, \’400px\’], //宽高
btn:[\’关闭\’],
content:\’型号：IPHONE第一代，发布日期：2007年1月9日<hr><br/>\’+
\’型号：3G，发布日期：2008年06月10日<hr><br/>\’+
\’型号：3GS，发布日期：2009年6月9日<hr><br/>\’+
\’型号：4，发布日期：2010年6月8日<hr><br/>\’+
\’型号：4S，发布日期：2011年10月04日<hr><br/>\’+
\’型号：5，发布日期：2012年9月13日<hr><br/>\’+
\’型号：5C，发布日期：2013年9月10日<hr><br/>\’+
\’型号：5S，发布日期：2013年9月10日<hr><br/>\’+
\’型号：6，发布日期：2014年9月10日<hr><br/>\’+
\’型号：6P，发布日期：2014年9月10日<hr><br/>\’+
\’型号：6S，发布日期：2015年9月10日<hr><br/>\’+
\’型号：6SP，发布日期：2015年9月10日<hr><br/>\’+
\’型号：7，发布日期：2016年9月8日<hr><br/>\’+
\’型号：7P，发布日期：2016年9月8日<hr><br/>\’+
\’型号：8，发布日期：2017年9月13日<hr><br/>\’+
\’型号：8P，发布日期：2017年9月13日<hr><br/>\’+
\’型号：X，发布日期：2017年9月13日<hr><br/>\’+
\’官方网址：<a href=\”https://www.apple.com/cn//?afid=p238%7C1dxLB2Qwz-dc_mtid_18707vxu38484_pcrid_16834665582_&cid=aos-cn-kwba-brand\” target=\”_blank\”>点击进入<a/>\’,
});
}
function reload(){
location.reload();
}

当然这里您使用switch case写也是可以的，毕竟if else很麻烦，写法是这样的：

/* 判断地址 */
switch (apple_adress){
case \’C\’:
address = \’深圳\’;
break;
case \’D\’:
address = \’成都\’;
break;
case \’F\’:
address = \’郑州\’;
break;
default:
layer.msg(\”序列号有误！请核对对后重新查询\”);
return false;
}

H5：

<div class=\”rain\”>
<div class=\”border start\”>
<form>
<label for=\”text\”>苹果手机序列号查询</label>
<input name=\”text\” type=\”text\” placeholder=\”序列号\” id=\”checkapple\”/>
<input type=\”button\” value=\”查询\” onclick=\”checkappleId()\”/>
<input type=\”button\” value=\”取消\” onclick=\”reload()\”/>
<input type=\”button\” value=\”苹果\” onclick=\”apple_info()\”/>
</form>
</div>
</div>

思路是：

拿到用户输入的序列号-截取第一位，第四位，第五位的值-根据规则判断值-给对应的参数赋值

喜欢的可以关注我，一起学习，虽然写的没有什么技术含量，但是还是很实用的，毕竟思路清晰是锻炼出来的，一点点积累吧！

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，请发送邮件至 55@qq.com 举报，一经查实，本站将立刻删除。转转请注明出处：https://www.szhjjp.com/n/31894.html

赞 (0)
nan
0
上一篇 2021-10-01
下一篇 2021-10-01

相关推荐

  • win7高清晰音频管理器怎么设置（电脑没有声音了恢复方法）

    1.打开win7系统上的控制面板，将其查看为一个小图标，然后单击RealtekHighDefinitionAudioManager。2.进入Realtek高清晰度音频管理器后，您可以看到扬声器和麦克风已设置完毕。首先，设置扬声器。扬声器的主音

    2021-10-23 • 科技
    0
  • 常用的二级域名是啥意思（一级域名申请二级域名的方法） 科技

    常用的二级域名是啥意思（一级域名申请二级域名的方法）

    不知道大家有没有发现，很多比较大的，或者是业务比较多的企业，其相关的线上论坛、商城、子平台等，都是使用二级域名建站的，例如百度知道（zhidao.baidu.com）、QQ音乐（y.qq.com）等等。其实关于二级域名，同样包含很多知识，那么大家对于

    2021-10-01
    0
  • 电脑桌面便签软件哪个好（好用的桌面日历软件推荐） 科技

    电脑桌面便签软件哪个好（好用的桌面日历软件推荐）

    每个人都有不同的记事方式，有的人喜欢用纸质笔记本来记，而有的人则喜欢用桌面便签软件来记。对于电脑普及程度比较高的今天，用便签软件来记事已经成了大的趋势，而选择一款简单实用的桌面便签则非常重要。一款功能

    2022-01-11
    0

  • WIN7系统的备份还原系统(win7备份和还原怎么用)

    那么Windows7系统可以创建系统备份和还原到备份的点吗？小编和你说同样可以，大家可以在系统设置里面查看一些恢复功能哦。控制面板里面的恢复功能我们点击恢复功能，首先在里面创建一个还原点，备份系统，当系统出现问题的时候我们就可以恢复系

    2021-12-11 • 科技
    0

  • 电脑USB无法识别U盘的解决方法(win7不识别u盘)

    Win7系统电脑所有的USB接口都无法使用怎么办？最近有用户在使用U盘时，突然遇到电脑所有USB接口都不能用的情况，无法识别U盘，而U盘在其他电脑正常使用，该如何解决呢？请看下文具体介绍。解决方法：1、当设置插入电脑USB接口后，如果

    2021-12-11 • 科技
    0
  • 压电薄膜传感器原理及应用（电压传感器的作用） 科技

    压电薄膜传感器原理及应用（电压传感器的作用）

    压力传感器是工业实践中最为常用的一种传感器，其广泛应用于各种工业自控环境，涉及水利水电、铁路交通、智能建筑、生产自控、航空航天、军工、石化、油井、电力、船舶、机床、管道等众多行业。并且在不同环境下，需要使用不同类型的压力传感器，以避免误差。不同压力传

    2021-09-10
    0

发表回复

登录后才能评论