<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>demo</title>
</head>
<body>
<div class="maxBox">
<span class="T-active indexA">首页</span>
<span class="T-active indexB">九块九包邮</span>
<span class="T-active indexC">优品购</span>
</div>
<div class="content">
<img src="img/1.png">
</div>
<div><img src="img/foot.png"></div>
</body>
<script src="//cdn.bootcss.com/jquery/3.0.0-alpha1/jquery.js"></script>
<script>
$('.T-active').each(function(){
$(this).click(function(){
if($(this).hasClass('indexA')){
var url = './index1.html';
Public(url);
}else if($(this).hasClass('indexB')){
var url = './index2.html';
Public(url);
}else if($(this).hasClass('indexC')){
var url = './index3.html';
Public(url);
}
})
});
// $('.maxBox').on('click','.T-active',function(){
// if($(this).hasClass('indexA')){
// var url = './index1.html';
// Public(url);
// }else if($(this).hasClass('indexB')){
// var url = './index2.html';
// Public(url);
// }else if($(this).hasClass('indexC')){
// var url = './index3.html';
// Public(url);
// }
//
// });
function Public(url){
$.ajax({
type:'post',
cache:'false',
url:url,
dataType:'html',
success : function(data){
$(".content").html(data)
}
})
}

</script>
</html>

ajax实现局部刷新的更多相关文章

  1. Ajax 异步局部刷新

    Ajax 异步局部刷新 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. 通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新.这意味着可以在不重新加载整个网页 ...

  2. asp.net mvc3 利用Ajax实现局部刷新

    1.利用Ajax.ActionLink()方法 首先在_Layout.cshtml文件中加载 运行AJAX必要的Jquery <script src="@Url.Content(&qu ...

  3. C# 利用ajax实现局部刷新

    C#所有runat="server"的控件都会造成整个界面的刷新,如果想实现局部刷新,可以利用ajax. 需要加入的控件有ScriptManager和UpdatePanel,可以实 ...

  4. jQuery+ajax实现局部刷新

    在项目中,经常会用到ajax,比如实现局部刷新,比如需要前后端交互等,这里呢分享局部刷新的两种方法,主要用的是ajax里面的.load(),其他高级方法的使用以后再做详细笔记. 第一种: 当某几个页面 ...

  5. Ajax定时局部刷新

    1.局部刷新一个地方 function refreshOnTime(){ $.ajax({ //配置 }); //7秒后重复执行该函数 setInterval('refreshOnTime', 700 ...

  6. [转载].NET ASP.NET 中web窗体（.aspx）利用ajax实现局部刷新

    之前开发的一套系统中用到了大量的 checkboxList 控件,但是每次选定之后都会刷新整个页面,用户体验很差,百度了之后查到这篇文章,尝试了一下可以实现,所以转载了过来,记录一下,也给其他有相同困 ...

  7. Ajax+Js局部刷新

    通过 AJAX,JavaScript 可使用 JavaScript 的 XMLHttpRequest 对象来直接与服务器进行通信.通过这个对象, JavaScript 可在不重载页面的情况与 Web ...

  8. 使用php后台给自己做一个页面路由，配合ajax实现局部刷新。

    今天就要放假了,把近来囤积的小玩意儿总结整理一下. 在请求一个html页面来嵌入到当前页会有一个问题,就是跟随请求过来的html他的样式表和脚本会失效.是因为文档加载的先后顺序等问题造成的.因此,加载 ...

  9. Highcharts折线图_结合ajax实现局部刷新

    1.首先,在https://www.hcharts.cn/下载Highcharts的组件. 2.然后,引用 <script src="../code/highcharts.js&quo ...

随机推荐

  1. 如何在SpringBoot中使用JSP ？但强烈不推荐，果断改Themeleaf吧

    做WEB项目,一定都用过JSP这个大牌.Spring MVC里面也可以很方便的将JSP与一个View关联起来,使用还是非常方便的.当你从一个传统的Spring MVC项目转入一个Spring Boot ...

  2. oncopy="document.selection.empty()"跟oncopy="return false"什么区别？

    实现效果一样,禁止复制. 区别: oncopy="document.selection.empty()"  没禁止,只是把它复制的内容,变成空了: oncopy="ret ...

  3. JS原型链

    JS作为发展了多年了对象语言,支持继承,和完全面向对象语言不同的是,JS依赖原型链来实现对象的继承. 首先JS的对象分两大类,函数对象和普通对象,每个对象均内置__proto__属性,在不人为赋值__ ...

  4. 简单说下COALESCE这个日常使用的函数

    COALESCE 作用是返回第一个非空的值. SELECT COALESCE(NULL,NULL,'A','CC') ---- A 原理的话其实也是相当于 case when A is not nul ...

  5. mkdir,rmdir,cp,rm,mv,cat,touch用法

    一.mkdir新建目录 1.进入tmp目录,查看该目录下面的子目录 [root@localhost ~]# cd /tmp[root@localhost tmp]# lshsperfdata_root ...

  6. C++实例讲解Binder通信

    binder是android里面的通信机制,这就不说它如何如何好了,Goog已经说过了,这里不多说.binder是一个面向对象的编程方法,大量使用虚函数类.最近研究binder看到一网友写的,就借鉴一 ...

  7. VS2015+Win10 调试DirectX 报错

    安装完Win10调试程序突然在这个地方报错: #if (defined(DEBUG) || defined(_DEBUG)) deviceFlags |= D3D11_CREATE_DEVICE_DE ...

  8. 项目游戏开发日记 No.0x000003

    14软二杨近星(2014551622) 刚刚过去清明节, 意味着离交项目的时间, 还有三个星期, 有点着急了, 可是, 还是觉得无所适从... 项目进展: 刚刚过去的一周, 事非常多, 以至于, 进展 ...

  9. git submodule初用

    git submodule主要是用于针对git项目中还存在git子模块的情况.在一般情况下,我们通过git clone 获取项目的时候会把项目中的所有信息都拿到.但是,如果相关中存在git子模块那么, ...

  10. BZOJ 1030: [JSOI2007]文本生成器 [AC自动机 DP]

    1030: [JSOI2007]文本生成器 Time Limit: 1 Sec  Memory Limit: 162 MBSubmit: 3953  Solved: 1614[Submit][Stat ...