zoukankan      html  css  js  c++  java
  • ajax helloworld jsp ajax入门,后台使用jsp

    简单ajax入门。开发环境选择MyEclipse, 服务器tomcat, jsp处理后台任务。

    搭建步骤:

    1. 在MyEclipse中新建project,例如MyAjax
    2. 在WebRoot下添加hello.jsp
    3. 修改index.jsp 以及 hello.jsp 如下

    index.jsp

     1 <html>
     2 <head>
     3 <title>Hello Ajax version 1</title>
     4 <style type='text/css'>
     5 * {
     6     font-family: Tahoma, Arial, sans-serif;
     7 }
     8 
     9 #helloTitle {
    10     color: #48f;
    11     font-size: 1.5em;
    12 }
    13 </style>
    14 <script type='text/javascript'>
    15     window.onload = function() {
    16         document.getElementById('helloBtn').onclick = function() {
    17             var xhr;
    18             var name = document.getElementById("helloTxt").value;
    19             if (window.XMLHttpRequest) {
    20                 xhr = new XMLHttpRequest();
    21             } else {
    22                 xhr = new ActiveXObject("Microsoft.XMLHTTP");
    23             }
    24             xhr.open("GET", "hello.jsp?name=" + name, true);
    25             xhr.onreadystatechange = function() {
    26                 var ready = xhr.readyState;
    27                 if (ready == 4) {
    28                     var status = xhr.status;
    29                     if (status >= 200 && status < 300) {
    30 
    31                         alert(xhr.responseText);
    32                     }
    33                 }
    34             } // end onreadstatechange
    35             xhr.send();
    36         }; // end onclick
    37     }
    38 </script>
    39 </head>
    40 <body>
    41     <h1 id='helloTitle'>Hello, stranger</h1>
    42     <p>Please introduce yourself by entering your name in the box below</p>
    43     <input type='text' size='24' id='helloTxt'></input>&nbsp;
    44     <button id='helloBtn'>Submit</button>
    45 </body>
    46 </html>

    hello.jsp

    <%--
    simple JSP to generate some questions - and answers--%>
    <jsp:directive.page contentType="text/plain"/>
    <%
    String name=request.getParameter("name");
    System.out.print(name);
    %>
    Hello, <%=name%>
    

      

    完成两个文件的修改后运行项目即可用ajax实现客户端与服务器的简单交互

  • 相关阅读:
    TStringList 常用操作(转自南山古陶)
    在Delphi中使用Indy控件实现邮件群发
    GSM手机SMS编码解码
    建别人进不了删不掉的文件夹
    播放 wav 文件
    delphi inherited,纯虚
    PDU编码规则
    sql函数
    基于GPRS的LED电子显示屏
    结对编程 队友代码分析
  • 原文地址:https://www.cnblogs.com/qiudeqing/p/ajaxHelloworld.html
Copyright © 2011-2022 走看看