已有文件目录如下：
webserver/
├── data
└── contact.json
├── images
├── img
├── js
├── action.js
└── jquery-1.9.1.min.js
├── css
├── About.html
├── Contact.html
├── Work.html
└── Index.html
请根据此已有文件，使用C语言多线程实现一个简单的web server(端口80)承载附件的web，提供完善Debug机制，Web server需完成get post等基础请求处理
已知contact.html是登录的页面，action.js源代码如下：
// JavaScript Document
/*
*所有js效果就绪，加载网页即执行
*
*/
$(function(){
/**** 根据显示器分辨率，选择css文件 ****/ if(screen.width > 960){ $("link").attr("href","css/style.css"); $("head").append("<link>"); } /**** 根据显示器分辨率，选择css文件 ****/ /*********** About页面Banner切换 ***********/ $("#about_slider").easySlider({ auto:true, width:415, height:362}); /*********** About页面Banner切换 ***********/ /*********** Contact页面表单验证 **************/ var inputNameObj = $("#name"); var inputEmailObj = $("#email"); var inputMessageObj = $("#message"); var isNameOn = false; var isEmailOn = false; var isMessageOn = false; /* 初始化按钮是否可按 */ isButton(); /* 处理name字段缓存 */ if(!isNull(inputNameObj.val())){ var text = inputNameObj.val(); if(!isName(text)){ $("#name").css("border-color","red"); isNameOn = false; } else{ $("#name").css("border-color","black"); isNameOn = true; } isButton(); } /* 处理email字段缓存 */ if(!isNull(inputEmailObj.val())){ var text = inputEmailObj.val(); if(isNull(text) || !isEmail(text)){ $("#email").css("border-color","red"); isEmailOn = false; } else{ $("#email").css("border-color","black"); isEmailOn = true; } isButton(); } /* 处理message字段缓存 */ if(!isNull(inputMessageObj.val())){ var text = inputMessageObj.val(); if(isNull(text) || !isMessage(text)){ $("#message").css("border-color","red"); isMessageOn = false; } else{ $("#message").css("border-color","black"); isMessageOn = true; } isButton(); } /* 检测SUBMIT按钮是否可按*/ function isButton(){ if(isNameOn && isEmailOn && isMessageOn){ $("#button").css("background-color","#f04922"); $("#button").removeAttr("disabled"); } else{ $("#button").css("background-color","#666"); $("#button").attr("disabled",true); } }; /* name字段输入时的格式检测 */ inputNameObj.keyup(function(){ var text = inputNameObj.val(); if(isNull(text) || !isName(text)){ $("#name").css("border-color","red"); isNameOn = false; } else{ $("#name").css("border-color","black"); isNameOn = true; } isButton(); }); /* email字段输入时的格式检测 */ inputEmailObj.keyup(function(){ var text = inputEmailObj.val(); if(isNull(text) || !isEmail(text)){ isEmailOn = false; } else{ $("#email").css("border-color","black"); isEmailOn = true; } isButton(); }); /* message字段输入时的格式检测 */ inputMessageObj.keyup(function(){ var text = inputMessageObj.val(); if(isNull(text) || !isMessage(text)){ $("#message").css("border-color","red"); isMessageOn = false; } else{ $("#message").css("border-color","black"); isMessageOn = true; } isButton(); }); /* 检测是否为空或者空格 */ function isNull(str){ if(str == "") { return true; } var regu = "^[ ]+$"; var re = new RegExp(regu); return re.test(str); }; /* name字段只有字母和数字，以字母开头 */ function isName(str){ var regu = /^[a-zA-Z][0-9a-zA-Z]*$/; var re = new RegExp(regu); if(regu.test(str)){ return true; } else{ return false; } }; /* email字段符合邮件格式 */ function isEmail(str){ var myReg = /^[-_A-Za-z0-9\.]+@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/; if(myReg.test(str)){ return true; } else{ return false; } }; /* message字段不能含不可见字符，如+#&=|<>^~ */ function isMessage(str){ var myReg = /[\+\#\&\=\|\<\>\^\~]/; if(myReg.test(str)){ return false; } else{ return true; } }; /* name字段光标移出时的检测 */ $("#name").blur(function(){ var text = inputNameObj.val(); if(isNull(text) || !isName(text)){ $("#name").css("border-color","red"); isNameOn = false; } else{ $("#name").css("border-color","black"); isNameOn = true; } isButton(); }); /* email字段光标移出时的检测 */ $("#email").blur(function(){ var text = inputEmailObj.val(); if(isNull(text) || !isEmail(text)){ $("#email").css("border-color","red"); isEmailOn = false; } else{ $("#email").css("border-color","black"); isEmailOn = true; } isButton(); }); /*message字段光标移出时的检测*/ $("#message").blur(function() { var text = inputMessageObj.val(); if(isNull(text) || !isMessage(text)){ $("#message").css("border-color","red"); isMessageOn = false; } else{ $("#message").css("border-color","black"); isMessageOn = true; } isButton(); }); /* 按钮触发事件 */ $("#button").click(function(){ /* post的httprequest请求 夹带name、email、message url为"data/contact.json" */ $.post("data/contact.json", { name:$("#name").val(), email:$("#email").val(), message:$("#message").val() },function(data){ $.each(data,function(InfoIndex,Info){ if(InfoIndex == "callback") { alert(Info); } }); }); });
/*********** Contact页面表单验证 **************/
/*********** 鼠标经过图片效果 **************/
$("#about_text ul img").each(function(k,img){ new JumpObj(img,10); $(img).hover(function(){ this.parentNode.parentNode.className="hover"; }); }); $("#footer ul img").each(function(k, img) { new JumpObj(img,10); $(img).hover(function() { this.parentNode.parentNode.className="hover"; }); });
/*********** 鼠标经过图片效果 **************/
});
/*
*About页面Banner实现从右到左切换效果函数
*
*/
(function($) {
$.fn.easySlider = function(options){ // 默认参数设置 var defaults = { speed: 1300, auto: false, pause: 3000, width: 415, height: 362, }; var options = $.extend(defaults, options); this.each(function() { var obj = $(this); var s = $("li", obj).length; var w = options.width; var h = options.height; obj.width(w); obj.height(h); obj.css("overflow","hidden"); var ts = s-1; var t = 0; $("ul", obj).css('width',s*w); $("li", obj).css('float','right'); function animate(dir,clicked){ var ot = t; if(ot == ts){ t = 0; $("ul",obj).css("margin-left","0px") }; t = t + 1; p = (t*w*-1); $("ul",obj).animate( { marginLeft: p }, options.speed ); if(options.auto){; timeout = setTimeout(function(){ animate("next",false); },options.speed+options.pause); }; }; // 初始化 var timeout; if(options.auto){; timeout = setTimeout(function(){ animate("next",false); },options.pause); }; }); };
})(jQuery);
/*
*
*鼠标经过图片抖动函数
*
*/
function JumpObj(elem, range, startFunc, endFunc) {
//图片鼠标移上去的动画效果
var curMax = range = range || 6;
startFunc = startFunc || function(){};
endFunc = endFunc || function(){};
var drct = 0;
var step = 1;
init(); function init() { elem.style.position = 'relative';active() } function active() { elem.onmouseover = function(e) {if(!drct)jump()} } function deactive() { elem.onmouseover = null } function jump() { var t = parseInt(elem.style.top); if (!drct) motionStart(); else { var nextTop = t - step * drct; if (nextTop >= -curMax && nextTop <= 0) elem.style.top = nextTop + 'px'; else if(nextTop < -curMax) drct = -1; else { var nextMax = curMax / 2; if (nextMax < 1) {motionOver();return;} curMax = nextMax; drct = 1; } } setTimeout(function(){jump()}, 200 / (curMax+3) + drct * 3); } function motionStart() { startFunc.apply(this); elem.style.top='0'; drct = 1; } function motionOver() { endFunc.apply(this); curMax = range; drct = 0; elem.style.top = '0'; } this.jump = jump; this.active = active; this.deactive = deactive;
}
最新发布
本文探讨了在ASP.NET中使用不同方式展示弹窗警告信息的方法，并对比了直接使用Response.Write与利用Page.ClientScript的不同效果及优缺点。
扫一扫
665
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
