一个容易的AJAX异步通信实例-AJAX教程-爱易网页

一个容易的AJAX异步通信实例

日期：2014-05-16　浏览次数：20938 次

一个简单的AJAX异步通信实例

textarea失去焦点时异步提交

index.jsp关键代码如下:

第一步：页面编写 其他控件也可，不限于textarea

<s:form action="" method="post">
         <div >
           <p > 今日心情：</p>
       <p >
        <textarea id="ta" name="signature"  onblur="ajax_submit();" ><s:property value="user.signature"/>  //siganature 是user对象的一个属性
        </textarea>
       </p>
      </div>
  </s:form>

第二步：在上述页面<head></head>之间加入如下js
<script language="javascript">

//定义一个变量用于存放XMLHttpRequest对象   
   var xmlHttp;   
   var deleteStatus ;//存放页面表格删除状态
   //改函数用于创建一个XMLHttpRequest对象   
   function createXMLHttpRequest(){   
       if(window.ActiveXObject){   
           xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");   
       }else if(window.XMLHttpRequest){   
           xmlHttp = new XMLHttpRequest();   
       }   
   }   

   //这是一个启动AJAX异步通信的方法   
   function ajax_submit(){   
      
       //创建一个XMLHttpRequest对象   
       createXMLHttpRequest();   

       //将状态绑定到一个函数   
       xmlHttp.onreadystatechange=processAjax;   
       //通过POST方法向指定的URL建立服务器的调用   
       var url="<%=basePath%>/workPlanAction!deleteWorkPlanDetail.action?dto.workplanDetailId="+detailid;   
       xmlHttp.open("POST",url,true);  

       //发送请求   
       xmlHttp.send(null);   
   }   
   //这是一个用来处理状态改变的函数   
   function processAjax(){   
       //定义一个变量用于存放 从服务器返回的响应结果   
       var responseContext="";   
       if(xmlHttp.readyState==4){   
           if(xmlHttp.status==200){   
               responseContext = xmlHttp.responseText;    
             // document.getElementById("ta").value=responseContext;   
           }   
       }   
   }  

</script>



第三步：编写action类 关键代码

//待导入包省略

public class UpdateSignatureAction extends ActionSupport implements ServletRequestAware{

public String execute(){

String responseText="";   
        //读取请求的参数   
        HttpServletRequest request = ServletActionContext.getRequest();   
        responseText=request.getParameter("signature"); 
        responseText=new String(responseText.getBytes("ISO-8859-1"),"GBK"); //去掉此行，会出现乱码
  HttpServletResponse response = ServletActionContext.getResponse();   
  response.setContentType("text/plain");//设置输出为文字流  
        response.setCharacterEncoding("UTF-8");   
        PrintWriter out = response.getWriter();   

        //直接输出响应的内容   
        out.println(responseText);   
        out.flush();   
        out.close(); 

其他将签名持久化到数据库的操作略去

return null;

}

}

免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。

一个容易的AJAX异步通信实例

相关资料更多>

推荐阅读更多>