在某公司实习,这几天分配下一个任务,就是实现web版的cmd命令执行效果,项目名称是网络追踪工具。先上效果图,图中的结果显示时是一条一条出来的。
实现此效果的重点之一是利用ajax异步请求,页面无刷新的好处,用户在页面看不出ajax的刷新过程,增强了用户体验。实现这个功能我的设想是这样的,点击执行时是一个ajax请求,将用户的cmd命令带到后台java代码的新线程中执行,将执行的结果存放到一个Queue中。在这个ajax请求的回调函数中唤起另一个ajax请求,我暂且叫它ajax2吧,ajax2会不断的发送请求,去Queue中poll出执行结果并在它的回调函数中显示在页面上。以下是两个ajax的js代码:
function checkSubmit() { $("#clip").text(""); $("#areaText").attr("value",""); var command = $("#command").val(); var params = $("#params").val(); $.ajax({ async:true, type: "POST" , url: "traceback.htm" , data: { 'command' :command, 'params' :params}, success: function (result){ $("#areaText").attr("value",result.areaText); if(result.poll!="*end*"){ setTimeout("searchResult()", 100); } if (!hasErrors(result)) { $( "#params" ).focus(); } } }); } function searchResult(){ var Text =$("#areaText").val(); ajaxPost("searchSession.htm", function(result) { $("#areaText").attr("value",Text+result.areaText); document.getElementById("areaText").scrollTop= document.getElementById("areaText").scrollHeight; if(result.poll!="*end*"){ setTimeout("searchResult()", 100);//每隔0.1秒进行一次请求 } }); }
相关推荐
打包好的Ajax代码,实现了对象化,使用时直接调用就可以了,调用时需要重构三个方法,如下: function onerror() //错误处理方法 { alert("error"); } function getInfo() //发送请求方法,包括请求方法和请求...
原生javascript实现ajax发送pos请求,这样可以脱离jquery框架,
Ajax如何发送请求? 原文章: https://blog.csdn.net/weixin_52203618/article/details/131324686 Ajax 是 Asynchronous Javascript And XML 的缩写,它是异步的 Javascript 和 XML技术,是由 Javascript 、 XML 、...
jsp+ajax发送GET请求的方法.docx
HTML使用极简的方式通过ajax请求实现前后端交互。文中不使用form表,为了方便ajax拼接其他参数。
基于ajax实现异步提交,页面为两个下拉选,左侧一个显示省份,选择不同的省份,右侧的下拉选显示对应的城市
使用AJAX发送异步请求。。。。。。。 XMLHttpRequest对象详解 。。。。。
1.情况描述:ajax发送成功,后台也成功响应请求,并返回了json数据,通过chrome监听请求也可以看到响应的json数据,但是就是不进success方法,反而跑到error方法中了 前端: $.ajax({ type : get, data : {'dbId'...
该示例解决了发送多个Ajax请求时引起的并发问题
vs2013 利用Ajax+Jquery实现异步进度条效果
ajax发送xml请求小示例
AJAX发送请求与接受,入门知识很好很基出,POSTANDGET
主要介绍了jsp+ajax发送GET请求的方法,包含了Ajax数据的发送与JSP文件的处理技巧,非常具有实用价值,需要的朋友可以参考下
Ajax在Web应用中使用得越来越频繁。在进行Ajax调用过程中一般都具有这样的做法:显示一个GIF图片动画表明后台正在工作,同时阻止用户操作本页面(比如Ajax请求通过某个按钮触发,用户不能频繁点击该按钮产生多个并发...
POST方式发送ajax请求详解,并对表单数据进行封装!
利用HttpSession实现Ajax请求重定向
最近做项目遇到一个需求,需要通过Ajax的post请求下载文件,把实现代码分享给大家。
ajax请求后台数据实现分页功能
原生Ajax发送请求原生Ajax发送请求
AJAX 请求完成时执行函数。Ajax 事件。 XMLHttpRequest 对象和设置作为参数传递给回调函数。