goahead 利用ajax实现局部刷新

前端之家收集整理的这篇文章主要介绍了goahead 利用ajax实现局部刷新前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

ajax===http://blog.csdn.net/seuge/article/details/8209685

“Asynchronous JavaScript and XML”(异步JavaScript和XML)

我们操作网页时往往只需要刷新网页上的一部分数据甚至可能是一个文本框内的数据,但是采用传统的刷新方式服务器会把整个页面重新发送至浏览器,浏览器再加载整个页面,这样不仅浪费了带宽,而且整个页面刷新视觉上也不流畅。

ajax技术解决了这一问题,ajax的思路是我需要刷新局部数据时给服务器一个请求,服务器收到请求后将数据将需要刷新的数据回送,浏览器接受到数据后通过脚本更新相应位置的数据,这个过程必须是在后台进行的。实现这个过程的核心便是JavaScript对象XmlHttpRequest。该对象在是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户

在goahead中的实现:

1.首先是一个前台页面

  1. <html>
  2. <head>
  3. <scripttype="text/javascript">
  4. functionloadXMLDoc()
  5. {
  6. varxmlhttp;
  7. if(window.XMLHttpRequest)
  8. {//codeforIE7+,Firefox,Chrome,Opera,Safari
  9. xmlhttp=newXMLHttpRequest();
  10. }
  11. else
  12. {//codeforIE6,IE5
  13. xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
  14. }
  15. xmlhttp.onreadystatechange=function()
  16. {
  17. if(xmlhttp.readyState==4&&xmlhttp.status==200)
  18. {
  19. document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
  20. }
  21. }
  22. xmlhttp.open("GET","/ajax/",true);
  23. xmlhttp.send();
  24. }
  25. </script>
  26. </head>
  27. <body>
  28. <divid="myDiv"><h2>需要刷新的局部内容</h2></div>
  29. <buttontype="button"onclick="loadXMLDoc()">通过AJAX实现局部刷新</button>
  30. </body>
  31. </html>
把改htm放入服务器中。

2.在服务器端实现XMLHttpRequest的请求应答。

为ajax请求专门创建一个handle //和asp 或form一样,在.c文件添加ajax处理函数

  1. intwebsAjaxHandler(webs_twp,char_t*urlPrefix,char_t*webDir,intarg,
  2. char_t*url,char_t*path,char_t*query)
  3. {
  4. websHeader(wp);
  5. websWrite(wp,T("<body><h2>thisisajaxtest!</h2>\n"));
  6. websFooter(wp);
  7. websDone(wp,200);
  8. return1;
  9. }
注册handle //也是和 asp 或form一样,注册

  1. websUrlHandlerDefine(T("/ajax"),NULL,websAjaxHandler,0);
这样就实现了局部刷新。

扩展

  1. xmlhttp.open("GET",true);
  2. xmlhttp.send();

这是后台数据请求,现在仅是示意,所以没有对ajax请求进行分类,以后可以进行细分比如 xmlhttp.open("GET","/ajax/time",true); 然后响应的在goahead端进行二次判断,作出响应的应答。 ################################################# 以上是特别好的框架 更加详细的解释参阅:http://www.w3school.com.cn/ajax/index.asp
原文链接:https://www.f2er.com/ajax/163920.html

猜你在找的Ajax相关文章