分析用到jsp部分的两种情况,一是用到form表单提交数据到jsp进行处理,一种是通过ajax传递数据到jsp进行处理返回数据。这里有几个常用的程序段,下面一一记录,方便以后使用。

1、通过form表单提交数据:



<form method="post" action="sql.jsp" οnsubmit="return checklog"> 
 <input type="text" name="message" placeholder="请输入留言"/> 
 <input type="text" name="username" placeholder="尊姓大名"/> 
 <input type="hidden" name="act" value="insert"/> 
 <button type="submit">提交</button> 
<!--<input type="submit" value="提交">--> 
 </form>



 

简述:其中method里面写的是传值方式,一共有两种,一个是get传值,一个是post传值,具体区别下次再总结;action是写提交到那个jsp表单进行处理,同一文件夹可以直接写,不同文件夹要写路径。onsubmit一般是客户端js进行判断后再上传,checklog是一个函数,用来进行检测验证。其中input的type为hidden是为了给后台传值是insert,从而jsp文件可以根据不同的表单传过来的值进行操纵数据库,是增删改查的哪一个。其中提交按钮用那种写法都可以,但要注意写上type类型。

 

通过ajax提交数据form写法:



<form> 
<input name="username" type="text" placeholder="请输入用户名"> 
<button id="btn" type="button">提交</button> 
<span></span> 
 </form>



 

简述:这里因为是用js获取值通过ajax提交处理,所以form不需要action。其中的span是用来接受jsp返回数据的标签。

2、js部分,第一种没有影响可以正常写,第二种会用到$.get|$.post|$.load传递数据

因为html里面经常用到input并且都有name值,所以写的时候可以用name的方法获取input的value值。



var username = $("*[name='username']").eq(0).val(); //获取vlaue值默认是获取第一个input的值,如果没有那么多就不用写索引值了。



 

    这是js内function的部分一个是注册验证函数fuction chekreg(){}一个是登录function checklog(){}和简单的的正则判断



function checkreg() { 
 var username = $("*[name='username']").eq(0).val(); //获取vlaue值 
 var password = $("*[name='password']").eq(0).val(); 
 var repassword = $("*[name='repassword']").val(); 
 var phone = $("*[name='phone']").val(); //获取vlaue值 
 var email = $("*[name='email']").val(); //获取vlaue值 
 if (!username.match(/^[A-Za-z0-9]{3,15}$/)) { 
 //每个汉字占3个字符 
 alert("用户名格式错误,请重新输入"); 
 return flase; 
 } 
 if (password.length < 8) { 
 alert("密码长度小于8位"); 
 return false; 
 } 
 if (password !== repassword) { 
 alert("两次输入密码不一致"); 
 return false; 
 } 
 if (!phone.match(/^1[34578][0-9]{9}$/)) { 
 alert("请输入正确的手机号"); 
 return false; 
 } 
 if (!email.match(/^[1-9][0-9]{4,10}@qq\.com$/)) { 
 alert("请输入qq邮箱"); 
 return false; 
 } 
 return true; 
} 
function checklog() { 
 var username = $("*[name='username']").eq(1).val(); //获取vlaue值 
 var password = $("*[name='password']").eq(1).val(); 
 if (!username.match(/^[A-Za-z0-9]{3,15}$/)) { 
 //每个汉字占3个字符 
 alert("用户名格式错误,请重新输入"); 
 return flase; 
 } 
 if (password.length < 8) { 
 alert("密码长度小于8位"); 
 return false; 
 } 
 return true; 
}



    

ajax的js写法



$("#btn").click(function () { 
 var name = $("*[name='username']").val(); 
 var url ="ajax.jsp?username=" + name; 
 $.get(url,function(data,status){ 
 $("span").html(data); 
 }); 
});