jQuery加载一个html页面到指定的div里
一、jQuery加载一个html页面到指定的div里
把a.html里面的某一部份的内容加载到b.html的一个div里。
比如:加载a.html里面的<div id=“row"></div>这个div里面的所有内容加载到b.html的这个div里<div id="content"></div>
用jquery ajax 可以实现
假设 a.html 和b.html在同一目录
b.html

1 <script >
2 $(document).ready(function() {
3 bodyContent = $.ajax({
4 url: "b.html",
5 global: false,
6 type: "POST",
7 data: ({
8 id: this.getAttribute('row')
9 }),
10 dataType: "html",
11 async: false,
12 success: function(msg) {
13 alert(msg);
14 }
15 })
16 });
17 </script>

二、juqery $.ajax 请求另一个html页面的指定的“一部分”加载到本页面div,重点是一部分数据加载到本页面div
大至思路如下:

1 $.ajax( {
2 url: url, //这里是静态页的地址
3 type: "GET", //静态页用get方法,否则服务器会抛出405错误
4 success: function(data){
5 var result = $(data).find("另一个html页面的指定的一部分");
6 $("本页面div").html(result);
7
8
9 }
10 });

或参考下面的代码:

1 $(function(){
2 $.ajax({
3 type:"POST",
4 url:"LoginLoadArticle.ashx",
5 data: "type="+escape("最新公告") ,
6 success:function(msg){
7 $(".gonggao").html(msg);
8 },
9 error:function(XMLHttpRequest, textStatus, thrownError){}
10 })
11
12 })

如果参数不明白可以参考
三、JQuery中$.ajax()方法参数详解
jQuery加载一个html页面到指定的div里的更多相关文章
- 使用jQuery加载html页面到指定的div
一.jQuery加载一个html页面到指定的div里 把a.html里面的某一部份的内容加载到b.html的一个div里.比如:加载a.html里面的<div id=“row"> ...
- ajax 请求另一个html页面的指定的一部分 加载到本页面div
$.ajax( { url: url, //这里是静态页的地址 type: "GET", //静态页用get方法,否则服务器会抛出405错误 success: function(d ...
- 原生js与jquery加载页面元素比较
原生js:将获取元素的语句写到页面头部,会因为元素还没有加载而出错,js提供了window.onload 这个方法事先加载元素 <script type="text/javascrip ...
- jquery加载页面的方法
jquery加载页面的方法(页面加载完成就执行),建议大家看下windows.onload与$(document).ready之间的区别. 1.$(function(){ $("#a&q ...
- jquery加载页面的方法(页面加载完成就执行)
jquery加载页面的方法(页面加载完成就执行),建议大家看下windows.onload与$(document).ready之间的区别. 1.$(function(){ $("#a&qu ...
- [转]jquery加载页面的方法(页面加载完成就执行)
jquery加载页面的方法(页面加载完成就执行),建议大家看下windows.onload与$(document).ready之间的区别. 1.$(function(){ $("#a&q ...
- jQuery加载部分视图(Partial Views)
本篇是演示使用jQuery加载部分视图(Partial View).如果你不想使用Razor的语法呈现部分视图,那此篇的方法是最理想的了.它可以Render至指定的tag上. 创建两个部分视图,一个为 ...
- easyui学习笔记8—在手风琴中加载其他的页面
在手风琴中加载其他页面和在表格中加载其他的页面有写类似的,就是请求另外一个页面显示数据. 1.先看看引用的资源文件 <link rel="stylesheet" href=& ...
- easyui学习笔记5—panel加载其他的页面
上一篇中我们看到了panel的基本实现,没有什么难度,最重要的是data-options和class两个标签属性的定义.这里我们将看一下在panel中如何加载其他的页面. 1.先看看引用的资源文件和h ...
随机推荐
- .NET Core HtmlAgilityPack HTML解析利器
最近学习.NET Core ,想把自己之前的一个项目升级到 .NET Core. 发现HtmlAgilityPack 没法进行引用,遂自己做了些修改,可以运行在 .NET Core 中.现在分享出来, ...
- C# 委托和事件(一):最简单的委托和事件
C#的事件基于委托,所以先说委托. 一切脱离实际场景的抽象概念新手看上去就像是在扯犊子,不错,我就是个新手.所以我需要一个实际的场景. 明天刚好考试(商务英语),考试上有两个角色(class):老师( ...
- JSP动作元素
JSP动作元素分类 <jsp:include page="content.jsp"></jsp:include> 使用<%@ include%> ...
- MySQL: LEAVE Statement
https://www.techonthenet.com/mysql/loops/leave.php This MySQL tutorial explains how to use the LEAVE ...
- Java基础复习笔记系列 三
前几节都是基础中的基础,从第三讲的笔记开始,每次笔记针对Java的一个知识块儿. Java异常处理 1.什么是异常? 异常是指运行期出的错误.比如说:除以一个0:数组越界:读取的文件不存在. 异常处 ...
- Scalaz(8)- typeclass:Monoid and Foldable
Monoid是种最简单的typeclass类型.我们先看看scalaz的Monoid typeclass定义:scalaz/Monoid.scala trait Monoid[F] extends S ...
- sp_get_menu函数使用分析
function sp_get_menu($id="main",$effected_id="mainmenu",$filetpl="<span ...
- bootstrap框架禁用谷歌字体
bootstrap框架禁用谷歌字体 H5框架换字体.png
- python CGI编程Apache配置
1. 编辑http.conf,添加两行,路径可以自定义 <Directory "C:/AppServ/www/cgi-bin"> AllowOverride None ...
- Maven+SSM框架实现简单的增删改查
Spring介绍: spring 使用基本的 JavaBean 来完成以前只可能由 EJB 完成的事情.然而, Spring的用途不仅限于服务器端的开发.从简单性.可测试性和松耦合的角度而言,任何Ja ...