Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇

效果截图：

重要代码：

/*具体函数定义，如下*/
//文章list区域：拼接渲染
var str = '';for(var i=0;i<group.length;i++){var imgurl = group[i].thumbnail;if(imgurl != ''){str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="'+'http://192.168.0.109:8081/ofcms-admin'+imgurl+'">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';} else {str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="static.docs.v1.1/images/scyl_2/default.jpg">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';}}


/* AJAX异步渲染DOM的时候，需要同步执行的函数*/
//转换日期格式
function getLocalTime(nS) {return new Date(parseInt(nS) ).toLocaleString().replace(/:\d{1,2}$/,' ');}

附：全部HTML代码：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><meta name="Description" content="考试加油站，特服宝典，特种作业学习平台"/><meta name="Keywords" content="考试加油站，特服宝典，特种作业学习平台"/><meta name="author" content="witherliu@foxmail.com"/><title>考试加油站</title>  <link rel="stylesheet" href="static.docs.v1.1/plugins/mui/css/mui.min.css"><!--mui下拉导航组件 · 动画--><link rel="stylesheet" type="text/css" href="static.docs.v1.1/plugins/mui/css/nav.animate.css"/><!--考试加油站--><link rel="stylesheet" type="text/css" href="static.docs.v1.1/css/m_shicaolilun.css"/><style type="text/css">#tagjsp{display: -webkit-box;display: -webkit-flex;display: flex;flex-direction: row;flex-wrap: nowrap;-webkit-box-pack: justify;-webkit-justify-content: flex-start;justify-content: flex-start;-webkit-box-align: center;-webkit-align-items: center;align-items: center;}</style>
</head><body><header class="mui-bar mui-bar-nav"><a class="mui-action-back mui-btn mui-btn-blue mui-btn-link mui-btn-nav mui-pull-left"><span class="mui-icon mui-icon-left-nav"></span>返回</a><a id="icon-menu" class="mui-action-menu mui-icon mui-icon-bars mui-pull-right"></a><h1 class="mui-title">考试加油站</h1></header><nav class="mui-bar mui-bar-tab nav-page" id="fixedpage"><!--分页--><div class="mui-content-padded mgtb0"><ul class="mui-pager"><li class="bd0"><a onclick="prePageFun()">上一页</a></li><li class="on"><a>1</a></li><li class="bd0"><a onclick="nextPageFun()">下一页</a></li></ul></div></nav><div class="mui-content pdb60" style="background: none;"><!--选项卡--><div style="position: fixed;top: 50px;left: 0;width: 100%;z-index: 10;"><div id="segmentedControl" class="mui-segmented-control mui-segmented-control-inverted sc-tabs"><a class="mui-control-item navli mui-active" onclick="categoryFun(26,'category',0,'高压电工')" id="category_26">报考指南</a></div></div><!--分类导航 · 位置固定--><div class="mui-card scroll-gz" style="border-radius: 0;margin: 0;box-shadow:none;position: fixed;top: 100px;left: 0;z-index: 10;width: 100%;"><div class="mui-card-footer bfnone overflw-x"  id="tagjsp"><a class="mui-btn gzbg" onclick="tagFun(28,'tag',0,'高压电工')" id="gzbg_28">考试动态</a>            </div></div><!--卡片区域--><div style="padding-top: 95px;"><div id="article-ul" class="mui-control-content tab-pane mui-active"><ul class="mui-table-view bfnone"><li class="mui-table-view-cell mui-media line"><a href=""><img class="mui-media-object mui-pull-left scyl-img" src="static.docs.v1.1/images/scyl_2/01.jpg"><div class="mui-media-body"><p class="scyl-title">新手学习电焊初期的 焊接技巧</p><p class="scyl-uptime">2018.05.23</p></div></a></li>       </ul></div><!--<div style="width: 100%;height: auto;"><img src="static.docs.v1.1/images/qst-dflt.png" style="margin: 0 auto;width: 100%;height: auto;"/><p style="text-align: center;color: #333333;font-size: 18px;">暂无数据</p></div>--></div></div><div id="menu-wrapper" class="menu-wrapper hidden"><div id="menu" class="menu line0"><ul class="mui-table-view mui-table-view-inverted"><li class="navlink-btns"><a href="index - 旧版 - 新升级.html">首页</a></li><li class="navlink-btns"><a href="#1">试题查询</a><a href="#2">模拟考试</a><a href="#3">全真题库</a><a href="m_shicaolilun.html">实操理论</a><a href="#5">易错题库</a><a href="#6">做题排行</a><a href="#6">课件讲义</a></li><li class="navlink-btns"><a href="m_meiriyilian.html">每日一练</a><a href="#2">智能组卷</a><a href="m_tglyc.html">通过率预测</a><a href="m_kaoshijiayouzhan.html">考试加油站</a></li><li class="navlink-btns"><a href="#1">我的错题</a><a href="#2">我的收藏</a><a href="#3">考试记录</a></li><li class="navlink-btns"><a href="m_kaoshijiayouzhan.html?#m_bkzn">报考指南</a><a href="m_kaoshijiayouzhan.html?#m_hyzx">行业资讯</a></li><li class="nav-grid-3"><ul class="mui-table-view mui-grid-view mui-grid-9"><li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href=""><span class="mui-icon slt_stcx"></span><div class="mui-media-body">试题查询</div></a></li><li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href=""><span class="mui-icon slt_mnks"></span><div class="mui-media-body">模拟考试</div></a></li><li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href=""><span class="mui-icon slt_qztk"></span><div class="mui-media-body">全真题库</div></a></li><li class="mui-table-view-cell mui-media mui-col-xs-3 mui-col-sm-3"><a href="m_shicaolilun.html"><span class="mui-icon slt_scll"></span><div class="mui-media-body">实操理论</div></a></li></ul></li></ul></div></div><div id="menu-backdrop" class="menu-backdrop bghalf"></div><script src="static.docs.v1.1/plugins/mui/js/mui.min.js"></script><!--mui下拉导航组件：点击切换 · 跳转链接--><script src="static.docs.v1.1/plugins/mui/js/mui_link.js"></script><!--逻辑专属--><script src="static.docs.v1.1/js/jquery.min.3.1.0.js" type="text/javascript" charset="utf-8"></script><!--文章刷新-->
<script type="text/javascript">
var linkurl = 'http://192.168.0.109:8080/cmsarticle/getColumnArticles.do';
var tagurl = 'http://192.168.0.109:8080/cmsarticle/menu.do';
var articleurl = 'http://192.168.0.109:8080/cmsarticle/getLabelArticles.do';
var pageNum=1, sizeNum=2, tagtype= 'category', eq=0, thisid=26, keywd='高压电工'; // 默认点击标签类型
window.onload = categoryFun(thisid,tagtype,eq,keywd,pageNum,sizeNum); //参数1~3：id,栏目层级，文章显示初始化eq值//上一页
function prePageFun(id,pageNum,sizeNum,linkMark){nextPageFun(id,pageNum,sizeNum)}
//下一页
function nextPageFun(id,pageNum,sizeNum,linkMark){  if(linkMark==1){linkMark=linkurl;} else {linkMark=articleurl;}$.ajax({ type:"get", //提交方式data:{ "id" : id,"keyWord": keywd,"page":pageNum,"size":sizeNum}, //查询的参数url: linkMark, //提交的路径dataType:"json", //返回的类型  是Text文本success:function(data){//              console.log(data);if(data==0) {console.log("不可以使用");}else{//获取需要的数据var group = data.data ;     console.log(data);//文章list区域：拼接渲染var str = '';for(var i=0;i<group.length;i++){var imgurl = group[i].thumbnail;if(imgurl != ''){str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="'+'http://192.168.0.109:8081/ofcms-admin'+imgurl+'">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';} else {str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="static.docs.v1.1/images/scyl_2/default.jpg">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';}}//增加查看全部if(group.length == 0){str="";str += '<li class="article-a-li-more">'+'<a class="mui-badge a-more">暂无数据</a>'+'</li>';} else {}            str = '<ul class="mui-table-view bfnone">'+str +'</ul>';//list拼接渲染$('#article-ul').html(str);//覆写上一页下一页var pagestr = '';var prePage = data.prePage;hasNextPage = data.hasNextPage,nextPage = data.nextPage,hasPrePage = data.hasPrePage;thisid = data.id;console.log("::"+prePage+hasNextPage+nextPage+hasPrePage+thisid)//当前页码var thisPage = prePage+1;if(hasPrePage==false && hasNextPage==true){ //没有上一页pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+    thisid+','+nextPage+','+sizeNum+')">下一页</a></li>'+'</ul>'+'</div>'}if (hasPrePage==true && hasNextPage==false){ //沒有下一頁pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+ thisid+','+prePage+','+sizeNum+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'</ul>'+'</div>'} if (hasPrePage==true && hasNextPage==true) { //有上下翻页pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+ thisid+','+prePage+','+sizeNum+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+   thisid+','+nextPage+','+sizeNum+')">下一页</a></li>'+'</ul>' +'</div>'}//统一渲染赋值$("#fixedpage").html(pagestr);}}});}function categoryFun(id,type,eq,keyword,pageNum,sizeNum){    if(id != thisid){ //如果切换一级栏目pageNum =1;}tagtype =  type;keywd = keyword;var catedata=[];$.ajax({ type:"get", //提交方式data:{ "id" : id,"keyWord": keywd,"page":pageNum,"size":sizeNum}, //查询的参数url: linkurl, //提交的路径dataType:"json", //返回的类型  是Text文本success:function(data){//                console.log(data);if(data==0) {console.log("不可以使用");}else{//console.log("可以使用categoryFun");//获取需要的数据var group = data.data ;  var catedata  = data.menus[0].children ;       /*console.log(catedata[0].children)//catedata = JSON.stringify(catedata)console.log(catedata[eq].children.length)console.log(catedata[eq].children[0].name)console.log(catedata[eq].children[1].name)*///  逻辑重调：终止引发的问题var tagstr="";
//              console.log("keyword=="+keyword);for(var i=0;i<catedata[eq].children.length;i++){tagstr += '<a class="mui-btn gzbg gzbg_'   + catedata[eq].children[i].id+ ' " onclick="tagFun('+ catedata[eq].children[i].id+','+" 'tag',"+ eq+" ,' " + keywd+" '," + pageNum+"," + sizeNum+"," + 1+" ) "+' " id="gzbg_'+ catedata[eq].children[i].id+' ">'+ catedata[eq].children[i].name+'</a>';}//tag拼接渲染$('#tagjsp').html(tagstr);//文章list区域：拼接渲染var str = '';for(var i=0;i<group.length;i++){var imgurl = group[i].thumbnail;if(imgurl != ''){str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="'+'http://192.168.0.109:8081/ofcms-admin'+imgurl+'">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';} else {str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="static.docs.v1.1/images/scyl_2/default.jpg">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';}}//增加查看全部if(group.length == 0){str="";str += '<li class="article-a-li-more">'+'<a class="mui-badge a-more">暂无数据</a>'+'</li>';} else {}           str = '<ul class="mui-table-view bfnone">'+str +'</ul>';//list拼接渲染$('#article-ul').html(str);//覆写上一页下一页var pagestr = '';var prePage = data.prePage;hasNextPage = data.hasNextPage,nextPage = data.nextPage,hasPrePage = data.hasPrePage;thisid = data.id;console.log("::"+prePage+hasNextPage+nextPage+hasPrePage+thisid)//当前页码var thisPage = prePage+1;if(hasPrePage==false && hasNextPage==true){ //没有上一页pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+    thisid+','+nextPage+','+sizeNum+','+1+')">下一页</a></li>'+'</ul>'+'</div>'                   }if (hasPrePage==true && hasNextPage==false){ //沒有下一頁pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+    thisid+','+prePage+','+sizeNum+','+1+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'</ul>'+'</div>'} if (hasPrePage==true && hasNextPage==true) { //有上下翻页pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+   thisid+','+prePage+','+sizeNum+','+1+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+ thisid+','+nextPage+','+sizeNum+')">下一页</a></li>'+'</ul>' +'</div>'}//统一渲染赋值$("#fixedpage").html(pagestr);}}});//标签$.ajax({ type:"get", //提交方式data:{ "id" : id,"keyWord": keywd,"page":pageNum,"size":sizeNum}, //查询的参数url: tagurl, //提交的路径dataType:"json", //返回的类型  是Text文本success:function(data){if(data==0) {console.log("不可以使用");}else{//console.log("可以使用tag：categoryFun");//获取需要的数据var group = data.data[0].children;
//                  alert(group)//拼接字符串var str2='';//对数据做遍历，拼接到页面显示for(var i=0;i<group.length;i++){if(group[i].id==id){str2 += '<a class="mui-control-item navli mui-active" onclick="categoryFun(' + group[i].id+','+ " 'category',"+ i+" ,' " + keywd+" '," + pageNum+"," + sizeNum+" ) "+' " id="category_'+ group[i].id+' ">'+ group[i].name+'</a>';} else {str2 += '<a class="mui-control-item navli" onclick="categoryFun(' + group[i].id+','+ " 'category',"+ i+" ,' " + keywd+" '," + pageNum+"," + sizeNum+" ) "+' " id="category_'+ group[i].id+' ">'+ group[i].name+'</a>';}}//放入页面的容器显示$('#segmentedControl').html(str2);}}});
}function tagFun(id,type,eq,keyword,pageNum,sizeNum){tagtype =  type;keywd = keyword;if(id != thisid){ //如果切换一级栏目console.log(id+"///"+thisid)pageNum =1;}//标签$.ajax({ type:"get", //提交方式data:{ "id" : id,"keyWord": keywd,"page":pageNum,"size":sizeNum}, //查询的参数url: articleurl, //提交的路径dataType:"json", //返回的类型  是Text文本success:function(data){if(data==0) {console.log("不可以使用");}else{console.log("可以使用tagFunyyyyyy");//获取需要的数据var group = data.data;console.log(data);console.log(group[0].content_id)//文章list区域：拼接渲染var str = '';for(var i=0;i<group.length;i++){var imgurl = group[i].thumbnail;if(imgurl != ''){str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="'+'http://192.168.0.109:8081/ofcms-admin'+imgurl+'">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';} else {str += '<li class="mui-table-view-cell mui-media line">'+'<a href="http://192.168.0.109:8080/cmsarticle/'+'1/' + id + '/'  + group[i].content_id+'.html">'+'<img class="mui-media-object mui-pull-left scyl-img" src="static.docs.v1.1/images/scyl_2/default.jpg">'+'<div class="mui-media-body">'+'<p class="scyl-title">'+group[i].title_name+'</p>'+'<p class="scyl-uptime">'+getLocalTime(group[i].create_time)+'</p>'+'</div></a>'+'</li>';}}           //增加查看全部if(group.length == 0){str="";str += '<li class="article-a-li-more">'+'<a class="mui-badge a-more">暂无数据</a>'+'</li>';} else {
//                  str += '<li class="article-a-li-more">'
//                          +'<a class="mui-badge a-more" href="">查看全部</a>'
//                          +'</li>';} str = '<ul class="mui-table-view bfnone">'+str +'</ul>';//list拼接渲染$('#article-ul').html(str);console.log(id)$(".gzbg").removeClass("on");$(".gzbg_"+id).addClass("on");    //覆写上一页下一页var pagestr = '';var prePage = data.prePage;hasNextPage = data.hasNextPage,nextPage = data.nextPage,hasPrePage = data.hasPrePage;thisid = data.id;console.log("::"+prePage+hasNextPage+nextPage+hasPrePage+thisid)//当前页码var thisPage = prePage+1;if(hasPrePage==false && hasNextPage==true){ //没有上一页console.log("ooookkkrrr")pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+  thisid+','+nextPage+','+sizeNum +','+2+')">下一页</a></li>'+'</ul>'+'</div>'}if (hasPrePage==true && hasNextPage==false){ //沒有下一頁pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+  thisid+','+prePage+','+sizeNum+','+2+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'</ul>'+'</div>'} if (hasPrePage==true && hasNextPage==true) { //有上下翻页pagestr += '<!--分页-->'+'<div class="mui-content-padded mgtb0">'+'<ul class="mui-pager">'+'<li class="bd0"><a onclick="prePageFun('+   thisid+','+prePage+','+sizeNum+','+2+')">上一页</a></li>'+'<li class="on"><a>'+thisPage+'</a></li>'+'<li class="bd0"><a onclick="nextPageFun('+ thisid+','+nextPage+','+sizeNum+','+2+')">下一页</a></li>'+'</ul>' +'</div>'}//统一渲染赋值$("#fixedpage").html(pagestr);}}});
}
//转换日期格式
function getLocalTime(nS) {return new Date(parseInt(nS) ).toLocaleString().replace(/:\d{1,2}$/,' ');}
</script>
</body>
</html>

以上就是关于“ Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇 ” 的全部内容。

Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇相关推荐

JAVA中.jsp模板文件AJAX异步请求 - 数据渲染问题
JAVA中.jsp模板文件AJAX异步请求 - 数据渲染失败,谁的过失? 后端已经查询出来结果,但是返回的API接口response查看不到对应的信息.(即:后台有,前台没有) 原因分析: 是因为AJ ...
layui-tree实现Ajax异步请求后动态添加html元素
最近在弄一个产品分类管理,是一个树形菜单的形式,用的是layui-tree ,由于它并没有动态添加节点,所以只能自己刚了. 大概效果如左图具体的实现是当我鼠标移入"长袖"这个分类 ...
form 表单提交时用ajax异步请求导致ajax请求结果无法接收问题
1.背景描述,有个公司内部用的小系统,不想大动干戈用太多前端框架,就用HTML5写了个登陆页面,刚开始想着用form表单提交登陆账户信息.后来因为前后端分离,并且统一用ajax调用后台服务交互数据,因 ...
javaWeb基础六：JQuery—Ajax异步请求
JQuery 之 Ajax 异步请求 1.1 Ajax简介 1.1.1 不使用Ajax存在的问题在发送请求得到响应时,我们常常只需要刷新网页局部的数据,而不是整个网页的资源(在网页资源过大时,效率会 ...
从浅到深，带你彻底搞懂AJAX异步请求
在平时开发过程中,异步请求似乎比同步请求出现的频率还要高一些.这是为什么呢?在同步请求时如果对网页的部分内容进行更新时,是不是就必须重载整个页面.这样肯定是不行的,这时就可以采用异步请求来解决此问题. ...
html弹窗赋值给查询框,bootstrap模态框动态赋值， ajax异步请求数据后给id为queryInfo的模态框赋值并弹出模态框（JS）...
/查询单个 function query(id) { $.ajax({ url : "/small/productServlet", async : true, type : &q ...
maven工程 java 实现文件上传 SSM ajax异步请求上传
java ssm框架实现文件上传实现:单文件上传.多文件上传(单选和多选),并且用 ajax 异步刷新,在当前界面显示上传的文件首先springmvc的配置文件要配置上传文件解析器: 1 < ...
php原生的异步请求,原生JavaScript实现Ajax异步请求
ajax现在是一种非常流行的技术,现在虽然可以利用JQuery或者一些第三方插件甚至微软提供的一些控件可以方面的实现ajax功能,但是明白其原理也是非常重要的,下面是来使用纯javascript实现获 ...
JSP同步请求和html+ajax异步请求的两种方式
war包:包括所有的项目资源,只要从浏览器发起的都是属于请求,然后把资源响应给浏览器,解析显示出来. 方式一:HTML+ajax(跳转静态html也是属于请求响应,把整个页面响应给浏览器.) html ...

Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇

文章目录

Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇

效果截图：

重要代码：

附：全部HTML代码：

Ajax异步请求（重渲染DOM元素时，如何自动调用并执行JS自定义函数【含代码】）- 案例篇相关推荐

最新文章

热门文章