这篇“Ajax实现页面内跳转的代码怎么写”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Ajax实现页面内跳转的代码怎么写”文章吧。
代码如下:
<script type="text/javascript" src="../js/jquery.min.js"></script> <script type="text/javascript"> $(function(){ //作业面局部刷新,不做页面跳转的时候,推荐使用ajax $("#login").click(function(){ //点击按钮实现登录功能 /* $.ajax({ type:'post', //type:请求方式,get,post url:'login.action', //要访问的后台地址 data:{ 'uname':$("#uname").val(), 'pwd':$("#pwd").val() }, success:function(result) { if(result=='1') { //1.welcome location.href="welcome.jsp"; } else { //2.login $("#tip").show(); } } }); */ /* $.post('login.action',{ 'uname':$("#uname").val(), 'pwd':$("#pwd").val() },function(result){ //回调函数:当后台成功响应结果时,会自动调用 if(result=='1') { //1.welcome location.href="welcome.jsp"; } else { //2.login $("#tip").show(); } }); */ $.get('login.action?uname='+$("#uname").val()+'&pwd='+$("#pwd").val(),function(result){ //回调函数:当后台成功响应结果时,会自动调用 if(result=='1') { //1.welcome location.href="welcome.jsp"; } else { //2.login $("#tip").show(); } }); }) }) </script>
body之中的内容:
<body> <table> <tr> <td>用户名:</td> <td> <input type="text" id="uname"> </td> </tr> <tr> <td>密码:</td> <td> <input type="password" id="pwd"> </td> </tr> <tr> <td colspan="2"> <input type="button" value="登录" id="login"> </td> </tr> </table> <span id="tip" style="color: red;display: none;">用户名或密码错误</span> </body>
LoginServlet.java中的doPost()方法:
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { PrintWriter out = response.getWriter(); String uname=request.getParameter("uname"); String pwd=request.getParameter("pwd"); System.out.println(uname); //1.登录成功 //2.登录失败 if("admin".equals(uname)&&"123".equals(pwd)) { //welcome out.print("1"); } else { //login out.print("2"); } out.flush(); out.close(); }
以上就是关于“Ajax实现页面内跳转的代码怎么写”这篇文章的内容,相信大家都有了一定的了解,希望小编分享的内容对大家有帮助,若想了解更多相关的知识内容,请关注亿速云行业资讯频道。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。