网站999（999朵玫瑰的网站在线预约功能1行代码就搞定）

客户的手机网站需要这么一个功能，临近年底他们做活动，中间有个明星暖场驻唱的环节，需要在首页加一个在线预约的功能。客户的手机网站之前是用.net开发的，也就是二次开发可维护性差一些，好在我在做pc版网站的时候给客户是用PHP开发的后台，里面用万能表单就可以实现这个功能，下面为大家演示操作步骤。第一步，在后台添加表单第二步，添加字段第三步，前台预览之后，查看网页源码，复制源码到网站首页模板文件中<form action=”/plus/diy.php” enctype=”multipart/form-data” method=”post”><input type=”hidden” name=”action” value=”post” /><input type=”hidden” name=”diyid” value=”1″ /><input type=”hidden” name=”do” value=”2″ /><table style=”width:97%;” cellpadding=”0″ cellspacing=”1″><tr> <td align=”right” valign=”top”>姓名：</td> <td><input type=’text’ name=’xm’ id=’xm’ style=’width:250px’ class=’intxt’ value=” /></td></tr><tr> <td align=”right” valign=”top”>电话：</td> <td><input type=’text’ name=’tel’ id=’tel’ style=’width:250px’ class=’intxt’ value=” /></td></tr><tr> <td align=”right” valign=”top”>预约项目：</td> <td><textarea name=’context’ id=’context’ style=’width:90%;height:80′></textarea></td></tr><input type=”hidden” name=”dede_fields” value=”xm,text;tel,text;context,multitext” /><input type=”hidden” name=”dede_fieldshash” value=”8db803fdd41d0dfab0845227ab5afdb71de34″ /></table><div align=’center’ style=’height:30px;padding-top:10px;’><input type=”submit” name=”submit” value=”提 交” class=’coolbg’ />&nbsp;<input type=”reset” name=”reset” value=”重 置” class=’coolbg’ /></div></form>以上就是我们生成的表单提交代码，我们把安复制到首页模板里就行了但是后来客户又找到了我，并且带来了好消息！每个页面都要加上这个预约功能，而且样式都要调整，字体字号要适应不同尺寸手机的分辨率！这个需求如果我们再用老方法，把它加到各各页面，那么每次客户需求变动，你都要在每个页面调整布局和样式了。一行代码搞定网站在线预约功能，任意页面都可以用不过这也难不倒我，只需要一行代码就能实现这样的效果，下面是暗体方案，ver=12表示第12个版本，我调试了12次，调1次强制刷新了1次客户端浏览缓存。这么好用的代码，现在就和您分享！在footer模板中加入这一句代码即可。<script src=”/js/foot_yuyue_540.js?ver=12″></script>上面的图片是整体效果，图片做了压缩，不然头条有图片大小限制传不上来下面为大家分享脚本中具体的实现细节function checkdata() {
if(yuyue.uname.value==”” ) {
alert(“请输入您的真实姓名!”);
yuyue.username.focus();
return false;
}
if(yuyue.tel.value==”” ) {
alert(“请输入您的常用号码!”);
yuyue.tel.focus();
return false;
}
if(yuyue.tel.value.length<7 || yuyue.tel.value.length>13)
{
alert(“联系电话格式不正确”);
yuyue.tel.focus();
return false;
}
if(yuyue.content.value==”” ) {
alert(“请输入您想预约的项目!”);
yuyue.content.focus();
return false;
}
}
function checkMobile(){
// 测试姓名
var username=document.yuyue.username.value;
if(( /^$/.test(username))){
alert(“请输入正确的姓名”);
document.yuyue.username.focus();
return false;
}
// 测试手机号
var sMobile = document.yuyue.tel.value;
if(!(/^(13[0-9]|14[57]|15[0-9]|170|177|18[0-9])\d{8}$/.test(sMobile))){
alert(“请输入正确的手机号”);
document.yuyue.tel.focus();
return false;
}
// 预约项目
var content=document.yuyue.content.value;
if(( /^$/.test(content))){
alert(“请输入正确的预约项目”);
document.yuyue.content.focus();
return false;
}
}
document.writeln(“<style>”);
document.writeln(“.clear{clear:both}”);
document.writeln(“.zaixian{ width:100%; margin:0px auto; margin-bottom:0px;}”);
document.writeln(“.zaixian_tou{ width:100%; height:40px; background-color:#2d3750; margin:0px auto; line-height:40px; text-align:center; }”);
document.writeln(“.zaixian_tou span{ font-size:26px;color:#ffffff;font-family:\’微软雅黑\'; font-weight:bold;}”);
document.writeln(“.zaixian_ti{ line-height:50px; width:100%; text-align:center; margin:40px auto 0;font-size:18px;color:#212121; }”);
document.writeln(“.zaixianh{padding:0px 20px}”);
document.writeln(“.zaixianh .tit_l{ float:left; color:#000000;font-family:\’微软雅黑\'; font-weight:bold; font-size:18px;width:25%;}”);
document.writeln(“.zaixianh .tit_l span{ color:#b30000; font-weight:normal;}”);
document.writeln(“.zaixianh .tit_v{ float:left;width:75%}”);
document.writeln(“.zaixianh input{ width:100%; height:40px; border: 1px solid #d0d1d5; font-size:26px; padding-left:10px;}”);
document.writeln(“.zaixianh textarea{ width:100%; height:100px; border: 1px solid #d0d1d5; font-size:26px; padding-left:10px; padding-top:10px; resize:none;}”);
document.writeln(“.zaixian_sent {margin:0px auto; width:100%; text-align:center;}”);
document.writeln(“.zaixian_sent .zxsent_btn {“);
document.writeln(” margin: 10px auto;”);
document.writeln(” background-color: #2d3750;”);
document.writeln(” border: 0 none;”);
document.writeln(” color: #ffffff;”);
document.writeln(” cursor: pointer;”);
document.writeln(” font-size: 26px;”);
document.writeln(” letter-spacing: 2px;”);
document.writeln(” font-family: \’微软雅黑\';”);
document.writeln(” font-weight: bold;”);
document.writeln(” height: 42px;”);
document.writeln(” line-height: 42px;”);
document.writeln(” width: 170px;”);
document.writeln(” border-radius: 5px;”);
document.writeln(“}”);
document.writeln(“”);
document.writeln(“</style>”);
document.writeln(“<div class=\’zaixian\’ style=\’margin-top:20px; \’>”);
document.writeln(” <div class=\’zaixian_tou\’><span>在线预约服务平台</span></div>”);
document.writeln(” <form action=\’/plus/diy.php\’ enctype=\’multipart/form-data\’ target=’_blank’ method=\’post\’ name=\’yuyue\’ onSubmit=\’return checkMobile();\’>”);
document.writeln(” <input type=\’hidden\’ name=\’action\’ value=\’post\’ />”);
document.writeln(“<input type=\’hidden\’ name=\’diyid\’ value=\’1\’ />”);
document.writeln(“<input type=\’hidden\’ name=\’do\’ value=\’2\’ />”);
document.writeln(” <div class=\’zaixian_ti clearfix\’>”);
document.writeln(” <div class=\’zaixianh clearfix\’><div class=\’tit_l\’><span>*</span>姓名</div><div class=\’tit_v\’><input name=\’xm\’ id=\’xm\’ type=\’text\’ required=\’required\’ placeholder=\’输入您的真实姓名\’></div></div>”);
document.writeln(” <div class=\’clear\’></div>”);
document.writeln(” <div class=\’zaixianh clearfix\’><div class=\’tit_l\’><span>*</span>电话</div><div class=\’tit_v\’><input name=\’tel\’ type=\’text\’ id=\’tel\’ required=\’required\’ maxLength=\’11\’ placeholder=\’请输入11位手机号\’/></div> </div>”);
document.writeln(” <div class=\’clear\’></div>”);
document.writeln(” <div class=\’zaixianh clearfix\’ style=\”margin-top:20px;\”><div class=\’tit_l\’><span>*</span>预约项目</div><div class=\’tit_v\’><textarea name=\’context\’ id=\’context\’ required=\’required\’ placeholder=\’输入您想预约的项目\’></textarea></div></div>”);
document.writeln(” </div>”);
document.writeln(” <input type=\’hidden\’ name=\’dede_fields\’ value=\’xm,text;tel,text;context,multitext\’ />”);
document.writeln(“<input type=\’hidden\’ name=\’dede_fieldshash\’ value=\’8db803rtddd41d0b0dfaf845227ab5afdb71de34\’ />”);
document.writeln(” <div class=\’clear\’></div>”);
document.writeln(” <div class=\’zaixian_sent\’><input type=\’submit\’ name=\’Submit\’ value=\’点击提交\’ class=\’zxsent_btn coolbg\’></div>”);
document.writeln(” </form>”);
document.writeln(“</div>”);我测试了12次的代码，您只需要一行语句引入就可以用了，这么好的代码你再不收藏转发，小邰都不干了！文末福利，收藏得萌妹子！如果觉得功能不错，请关注我哦！有网站制作的需求，网站维护的难题也可以抛给我哟。