分析用到jsp部分的两种情况，一是用到form表单提交数据到jsp进行处理，一种是通过ajax传递数据到jsp进行处理返回数据。这里有几个常用的程序段，下面一一记录，方便以后使用。
1、通过form表单提交数据：
<form method="post" action="sql.jsp" onsubmit="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); }); }); |