资源描述
编程日常练习代码.docx
《编程日常练习代码.docx》由会员分享,可在线阅读,更多相关《编程日常练习代码.docx(22页珍藏版)》请在冰豆网上搜索。
编程日常练习代码
网络编程日常程序
作者:
Zealjiang
时间:
20101225
目录
1、一个添加商品的效果图1
2、如何设置字体颜色?
8
3、AJAX获取XMLHttpRequest对象的方法8
4、一个ajax与servlet交互的实例get请求方式9
1、一个添加商品的效果图
用jQuery写的动态验证及添加20101225
效果图如下:
如果添写的格式不对,或添写为空,有如下警告:
以下是原代码:
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01//EN""http:
//www.w3.org/TR/html4/strict.dtd">
AddProduct
body{padding:
0;margin:
0;}
#show_add_product{border-color:
#999;width:
500px;padding:
0;margin:
0;margin-top:
80px;}
#show_add_producttrth{background-color:
#000000;color:
#ffffff;border-spacing:
10px;padding:
10px;}
fieldset{width:
500px;}
#add_producttrtd{text-align:
left;}
$(function(){
varwarning=document.getElementById("warning").innerHTML;
varidd=$('#idd');
varid=$('#id');
varwarning=$("span");
id.blur(function(){
varinput_id=id.val();
varpattern_assigned=/^P\d{4}$/;
//判断商品编号是否为空
if(input_id==null||input_id==''){
warning.html('red">警告:
商品编号不能为空');
return;
}else{
warning.html('');
}
varisright_id=pattern_assigned.test(input_id);
if(!
isright_id){
idd.show();
warning.html('red">警告:
商品编号格式不正确!
');
}else{
idd.hide();
warning.html('');
}
});
varnamed=$('#named');
varname=$('#name');
varpattern_cn=/^[\u4e00-\u9fa5]+$/;
name.blur(function(){
//判断商品名称是否为空
varinput_name=name.val();
if(input_name==null||input_name==''){
warning.html('red">警告:
商品名称不能为空');
return;
}else{
warning.html('');
}
varisright=pattern_cn.test(input_name);
if(!
isright){
named.show();
warning.html('red">警告:
商品名称格式不正确!
');
}else{
named.hide();
warning.html('');
}
});
varproduct_priced=$('#product_priced');
varproduct_price=$('#product_price');
varpattern_num=/^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/;
product_price.blur(function(){
varinput_productPrice=product_price.val();
if(input_productPrice==null||input_productPrice==''){
warning.html('red">警告:
商品价格不能为空!
');
return;
}else{
warning.html('');
}
varisright2=pattern_num.test(input_productPrice);
if(!
isright2){
product_priced.show();
warning.html('red">警告:
商品价格格式不正确!
');
}else{
product_priced.hide();
warning.html('');
}
});
varvip_priced=$('#vip_priced');
varvip_price=$('#vip_price');
varpattern_num=/^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/;
vip_price.blur(function(){
varinput_vipPrice=vip_price.val();
if(input_vipPrice==null||input_vipPrice==''){
warning.html('red">警告:
会员价格不能为空');
return;
}else{
warning.html('');
}
varisright3=pattern_num.test(input_vipPrice);
if(!
isright3){
vip_priced.show();
warning.html('red">警告:
会员价格格式不正确!
');
}else{
vip_priced.hide();
warning.html('');
}
});
varmail_priced=$('#mail_priced');
varmail_price=$('#mail_price');
varpattern_num=/^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/;
mail_price.blur(function(){
varinput_mailPrice=mail_price.val();
if(input_mailPrice==null||input_mailPrice==''){
warning.html('red">警告:
费用不能为空');
return;
}else{
warning.html('');
}
varisright4=pattern_num.test(input_mailPrice);
if(!
isright4){
mail_priced.show();
warning.html('red">警告:
费用格式不正确!
');
}else{
mail_priced.hide();
warning.html('');
}
});
//添加商品成功后到显示区域
$('#add').click(function(){
varc=confirm("是否确认添加");
if(c==true){
if($('#warning').html()){
alert("添加失败!
");
return;
}elseif($('#id').val()==null||$('#id').val()==''){
alert("添加失败,商品编号不允许为空!
");
}elseif($('#name').val()==null||$('#name').val()==''){
alert("添加失败,商品名称不允许为空!
");
}elseif($('#product_price').val()==null||$('#product_price').val()==''){
alert("添加失败,商品价格不允许为空!
");
}elseif($('#vip_price').val()==null||$('#vip_price').val()==''){
alert("添加失败,会员价格不允许为空!
");
}elseif($('#mail_price').val()==null||$('#mail_price').val()==''){
alert("添加失败,邮递费用不允许为空!
");
}else{
varshow_add_product=$('#show_add_product');
varnewRow=$('
');
for(varj=1;j<=5;j++){
varnewColumn=$('
| ');
switch(j){
case1:
varid=$('#id').val();
newColumn.append(id);
break;
case2:
newColumn.append($('#name').val());
break;
case3:
newColumn.append("¥"+$('#product_price').val());
break;
case4:
newColumn.append("¥"+$('#vip_price').val());
break;
case5:
newColumn.append("¥"+$('#mail_price').val());
break;
default:
break;
}
newRow.append(newColumn);
}
alert("恭喜!
新商品添加成功!
");
show_add_product.append(newRow);
}
}else{
alert("添加失败!
");
}
});
})
商品编号 | 商品名称 | 产品价格 | 会员价格 | 邮递费用 |
---|
商品编号: | | 商品编号格式为:
P0001
商品名称: | | 商品名称必须为汉字
商品价格: | | 商品价格必须为数字
会员价格: | | 价格必须为数字:
邮递费用: | | 费用必须为数字
添加
2、如何设置字体颜色?
设置字体颜色用:
color:
red;
3、AJAX获取XMLHttpRequest对象的方法
functionajaxFunction(){
varxmlHttp;
try{
//Firefox,Opera8.0+,safari
xmlHttp=newXMLHttpRequest();
}catch(e){
//InternetExplorer6.0+
try{
xmlHttp=newActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
//InternetExplorer5.5+
xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}catch(e){
alert("您的浏览器不支持AJAX!
");
returnfalse;
}
}
}
}
4、一个ajax与servlet交互的实例get请求方式
效果如下:
testAjax.html的代码如下:
DOCTYPEHTMLPUBLIC"-//W3C//DTDHTML4.01Transitional//EN">
testAjax.html
functionajaxFunction(){
varxmlHttp;
try{
//Firefox,Opera8.0+,safari
xmlHttp=newXMLHttpRequest();
}catch(e){
//InternetExplorer6.0+
try{
xmlHttp=newActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
//InternetExplorer5.5+
xmlHttp=newActiveXObject("Microsoft.XMLHTTP");
}catch(e){
alert("不支持AJAX!
");
returnfalse;
}
}
}
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4){
document.myForm.time.value=xmlHttp.responseText;
}
}
varusername=document.myForm.username.value;
//用encodeURI对username进行两次编码,再在后台进行一次解码就不会出现乱码了
//varurl='ajax?
username='+encodeURI(encodeURI(username));
//或者下面这样写
varurl='ajax?
username='+username;
url=encodeURI(encodeURI(url));
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
姓名:
时间:
Web.xml文件配置如下:
ReceiveAJAX
test.ReceiveAJAX
ReceiveAJAX
/ajax
test.ReceiveAJAX代码如下:
packagetest;
importjava.io.IOException;
importstatic.URLDecoder.decode;
importjavax.servlet.ServletException;
importjavax.servlet.http.HttpServlet;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
importjava.io.PrintWriter;
publicc