前言
有幸在公司组织下，参加了2017年中国技能大赛（网站设计）决赛，决赛完毕，公布一下大赛源码，及相关感悟吧！
关于大赛
大赛是市一级大赛，还有开幕式等仪式。比赛为期一天，分为上午和下午场，考试题目请查看： https://github.com/confidence68/Tic-Tac-Toe_byexam/blob/master/%E5%86%B3%E8%B5%9B%E8%AF%95%E9%A2%98/%E7%BD%91%E7%AB%99%E8%AE%BE%E8%AE%A1_%E5%86%B3%E8%B5%9B%E6%A0%B7%E9%A2%98.pdf
上午场主要是页面重构，制作自适应网站，不过时间比赛时间只有2个小时，时间很紧。
下午场只要制作Tic-Tac-Toe游戏，用php制作。时间也是2个小时。
我考试之前做了一遍题目，题目已经上传了github， https://github.com/confidence68/Tic-Tac-Toe_byexam/tree/master/Tic-Tac-Toe
感悟
考试和公司写代码有很大差别，最主要差别就是时间紧，有限时间内，把相关知识点完善。争取得分点最大化，这才是高分的关键。
我参加这次考试，虽然考试前，已经做了一下题目，感觉题目会做。但是考试的时候，还是时间不够！有很多问题，做的比较差！
问题一：
模块一简单的图片切换效果！因为网站资料有限，考试时是断网的。图片切换的话，只能自己写！我线下写了一个最简单的图片切换效果，代码如下：
//图片切换
var changeimageArray=[
'Images/photo_gallery/photo-1.png',
'Images/photo_gallery/photo-2.png',
'Images/photo_gallery/photo-3.png',
'Images/photo_gallery/photo-4.png',
'Images/photo_gallery/photo-5.png'
];
var interTime=2000,currentindex=0,bgindex=1;
function changeImgae(){
if(currentindex==changeimageArray.length-1){
currentindex=0,bgindex=1;
}else{
currentindex++,bgindex++;
if(bgindex==changeimageArray.length){
bgindex=0;
}
}
$("#imagechange").attr("src",changeimageArray[currentindex]).hide(500);
$("#imagechange").show();
$(".imgslide").css({"background-image":"url("+changeimageArray[bgindex]+")","background-size":"100% auto"});
};
var slidetag=setInterval(changeImgae,interTime);
$(".imgslide").hover(function(){
clearInterval(slidetag)
},function(){
slidetag=setInterval(changeImgae,interTime);
})
html代码如下：
<div class="imgslide">
<img class="imgzw" id="imagechange" src="Images/photo_gallery/photo-1.png">
</div>
我是设置2张图片，切换效果使用hide和show，鼠标移到图片上去，图片停止切换。移开，图片继续自动切换！
但是考试的时候，我也是这么写的，因为整个考试时间只有2个小时，还有整个页面的布局，这个效果我写只用了3分钟时间，但是写出来之后，发现没有效果！无奈之下，考试时间已到，我只能交卷了。交卷之后发现，我if语句双等号写成了单等号赋值！一个小小的粗心，导致这个题目错误！悲殆！
问题二：
Tic-Tac-Toe这个游戏制作，我之前写过，之前的源码已经放到github上面了。但是考试的时候，时间太紧，第一个图片上传压缩，考试的时候发现上传没反应。简单找了一下原因，还是没有找到，因此，就做其他题目了。
图片上传到指定目录，然后压缩成60*60的比例！我是如下写的：
<?php
if(@is_uploaded_file($_FILES['photo']['tmp_name'])){//@符合可以屏蔽错误
$upfile=$_FILES["photo"];
//获取数据里面的值
$name=iconv("UTF-8","gb2312", $upfile["name"]);//上传文件名称
$type =$upfile["type"];//上传文件类型
$size=$upfile["size"];//上传文件大小
$tmp_name =$upfile["tmp_name"];//上传文件临时存放路径
$template =$_REQUEST["template"];
//判断上传文件类型
switch ($type){
case 'image/pjpeg';
$okType =true;
break;
case "image/jpeg";
$okType =true;
break;
case 'image/png';
$okType =true;
break;
}
if($okType){
/**
* 0:文件上传成功<br/>
* 1：超过了文件大小，在php.ini文件中设置<br/>
* 2：超过了文件的大小MAX_FILE_SIZE选项指定的值<br/>
* 3：文件只有部分被上传<br/>
* 4：没有文件被上传<br/>
* 5：上传文件大小为0
*/
$error=$upfile["error"];//上传后系统返回错误
if($error!=0){
echo '<script>$(".alert",".alert-spacing-error").html("<span class=underline>图片大小错误:</span> 请确认图片尺寸是否正确!!</article>")</script>';
}else{
cut_img($tmp_name,60,60,$name, $type);
setcookie("headerimg", "pictures/".$name, time()+2592000);
header("Location: index.php");
exit();
}
}
}
//图片裁剪函数
function cut_img($img,$width,$height,$imgname,$img_type){ //要裁剪突破的宽度、高度、图片类型
list($imageWidth, $imageHeight) = getimagesize($img);
if($img_type=='image/pjpeg' || $img_type=='image/jpeg'){
$s = imagecreatefromjpeg($img);
} else if($img_type == "image/png"){
$s = imagecreatefrompng($img);
}
$width = imagesx($s)<$width?imagesx($s):$width; //如果图片的宽比要求的小，则以原图宽为准
$height = imagesy($s)<$height?imagesy($s):$height;
$bg = imagecreatetruecolor($width,$height);
imagecopyresampled($bg,$s,0,0,0,0,$width,$height,$imageWidth,$imageHeight);//生成50*50缩略图
imagejpeg($bg,"pictures/".$imgname);//移动目录
imagedestroy($s); //关闭图片
imagedestroy($bg);
}
?>
我在线下写的是没有问题的，但是考试的时候，我也是这么写的，但是图片没有到指定的目录。
我仔细看了一下，imagejpeg 这个函数的一个参数写错了！
好郁闷，因为一个参数写错了，我上传图片压缩这个模块估计没有分数了！
总结
模块一因为if语句双等号写错了，导致网站效果没有出来，这个是粗心所致，后面一定要注意，做事要细心！
模块二上传图片，一个函数的参数写错了，导致整个上传图片压缩没有效果。这说明我php知识还是不扎实！
注：本文内容来自互联网，旨在为开发者提供分享、交流的平台。如有涉及文章版权等事宜，请你联系站长进行处理。