AJAX学习笔记01
学习课程:
学习步骤:
1.建立Java Web 项目——AJAX_01:
2.建立Servlet,包名test ,类名AjaxServlet,doPost()代码:
- request.setCharacterEncoding( "utf-8" );
- response.setContentType("text/html;charset=utf-8");
- PrintWriter out = response.getWriter();
- String s = request.getParameter( "username" );
- out.print( "返回结果:" + s );
|
3.修改index.jsp页面代码:
- <div id="result"></div>
- <form id="form1" action="servlet/AjaxServlet" method="post">
- <input type="text" id="username" name="username"/>
- <input type="button" id="submit" value="提交"
- οnclick="verify()"/>
- </form>
|
4.在WebRoot下建立包jslib,将jquery.js放到这个包中,并且建立verify.js文件,写入代码:
- function verify(){
- var jqueryObj = $("#username");
- var username = jqueryObj.val();
- alert( username );
- $.get( "servlet/AjaxServlet?username=" + username , null , callback );
- }
- function callback(data){
- alert( "服务器的数据回来了" );
- var resultObj = $("#result");
- resultObj.html( data );
- }
|
5.在index.jsp中导入js代码:
- <script type="text/javascript" src="jslib/verify.js"></script>
- <script type="text/javascript" src="jslib/jquery.js"></script>
|