Jquery load()方法 实现公用头部 尾部

//这是header.html里的代码，想作为头部引进来

<div id="loginBox">
    <span></span>
    <div>
        <div>
            <img src="common/images/login.jpg" alt="login"/>
        </div>
        <div>

        </div>
        <div>
            <label for="">
                <span>姓名:</span>
                <input id="username" type="text" placeholder="input your name"/>
            </label>
        </div>
        <div>
            <label for="">
                <span>密码:</span>
                <input id="password" type="password" placeholder="input your password"/>
            </label>
        </div>
        <div>
            <b>
                <button type="submit" id="loginsub" class="btn btn-success" >登陆</button>
                <button type="reset" id="loginset" class="btn btn-danger">重置</button>
            </b>
        </div>
    </div>
</div>

在header.js里边这样写

$("#header").load('common/html/header.html', function (data, status, xhr) {}）

在在想要引用的文件中找到想引用的部分即可

<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="../common/css/header.css"/>
    <link rel="stylesheet" href="../common/css/footer.css"/>
    <link rel="stylesheet" href="../tool/bootstrap/dist/css/bootstrap.css"/>
    <link rel="stylesheet" href="css/management.css"/>
    <title>Hisense</title>
</head>
<body>
<div id="header"></div>

版权声明：本文为博主原创文章，未经博主允许不得转载。

时间： 2024-08-08 03:33:19

Jquery load()方法 实现公用头部 尾部的相关文章

在 ASP.NET 中使用 jQuery.load() 方法

今天就让我们看看在 ASP.NET 中使用 jQuery.load() 方法来调用 ASP.NET 的方法,实现无刷新的加载数据. 使用 jQuery 的朋友应该知道可以使用 jQuery.load() 加载静态页面,并可指定要加载的区域,如在"test.html"中有如下内容: <div id="show"> <a href="http://www.jquery001.com/">jQuery001</a>

jquery load() 方法 语法

jquery load() 方法 语法 作用:当指定的元素(及子元素)已加载时,会发生 load() 事件.该事件适用于任何带有 URL 的元素(比如图像.脚本.框架.内联框架).根据不同的浏览器(Firefox 和 IE),如果图像已被缓存,则也许不会触发 load 事件.还存在一个名为 load() 的 jQuery Ajax 方法,根据不同的参数而定.无锡大理石测量平台 语法:$(selector).load(function(){}) 参数: 参数 描述 function     必需.

jquery load 方法回显数据

使用jQuery对象.load()方法 load() 方法的作用是可以通过 AJAX 请求从服务器加载数据,并把返回的数据直接放置到指定的元素中. 该方法使用起来非常简单,大大简化了ajax开发 语法 : jQuery对象 . load(url, param ,callback); url 访问服务器地址 param 发送给服务器参数 callback 当正常返回后 执行回调函数 注意:如果 param存在,以POST方式请求, 如果param 不存在,以GET方式请求 示例 1.基本使用 <!

jQuery load()方法用法集锦！

调用load方法的完整格式是:load( url, [data], [callback] ),其中 url:是指要导入文件的地址. data:可选参数:因为Load不仅仅可以导入静态的html文件,还可以导入动态脚本,例如PHP文件,所以要导入的是动态文件时,我们可以把要传递的参数放在这里. callback:可选参数:是指调用load方法并得到服务器响应后,再执行的另外一个函数. 一:如何使用data 1.加载一个php文件,该php文件不含传递参数 $("#myID").load(

jquery load方法 导致页面和js加载了两次

出现这种问题一个很可能的原因就是:事件绑定的代码被执行了两次! 请先仔细检查代码 $(".items img").click(function(){...}); 确保只绑定了一次,没有重复绑定. 如果找不出原因(比如某些jQuery版本自身的bug会导致某些事件重复触发),再尝试改成如下代码: $(".items img").unbind('click').click(function(){...}); 先解绑,再重新绑定,这样可以绕过这个问题,避免重复绑定. 终于

jquery load() 方法 识别 参数 [data]的请求方式（get/post）

$('#order_form').load(url,<?php echo json_encode($_POST);?>); // $('#result').load(url,[data],[callback]); // [data] 可以识别参数有两种分别对应 get/post 请求: // ①字符串形式的json参数 (get 请求) // ② object 对象[object Object](post 请求)

jQuery AJAX load() 方法

jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector).load(URL,data,callback); 必需的 URL 参数规定您希望加载的 URL. 可选的 data 参数规定与请求一同发送的查询字符串键/值对集合. 可选的 callback 参数是 load() 方法完成后所执行的函数名称. 这是示例文件("demo_test.txt")

JavaScript教程之jQuery - AJAX load() 方法

jQuery - AJAX load() 方法 jQuery load() 方法 jQuery load() 方法是简单但强大的 AJAX 方法. load() 方法从服务器加载数据,并把返回的数据放入被选元素中. 语法: $(selector).load(URL,data,callback); 必需的 URL 参数规定您希望加载的 URL. 可选的 data 参数规定与请求一同发送的查询字符串键/值对集合. 可选的 callback 参数是 load() 方法完成后所执行的函数名称. 这是示例

使用jquery的load方法设计动态加载，并解决被加载页面JavaScript失效问题

一.问题分析 对于后台系统,相比大家都有所印象,知道其中的布局结构,如图: 在这种布局中我们需要将header,sidebar,footer分开,而且对于中间部分的content内容需要动态变化,即根据不同菜单定位到不同页面,而整体布局不会变化 这种布局结构对于单纯的HTML不具备这种嵌入各部分内容的能力,所以就需要我们自己来寻找或者解决这种问题,由于jquery的兼容性和使用广度比较不错,这里 使用jquery的load方法来处理这种页面布局框架. 二.load方法详解 1.定义 $(sele