load函数的作用

1.load函数的作用是，从server获取数据，而且把数据放到指定的元素（通常是div元素）中。

2.说的再具体一些就是，把获取到的数据插入到当前文档的某个div元素中。

server上的资源文件

上面所说的所谓的数据，就是server上的资源文件（.html、.jsp等）。

资源文件中不能包括什么？

1.假设是一般的情况的话，应该是能够包括js代码的。

2.假设是使用jquery blockUI的话，即把从server上获取的数据放在遮罩层里：资源文件中不能包括js代码。而应该把js代码都写在宿主文件（即当前文件）中。

由于资源文件中的js函数都无效，详细原因不是非常清楚。

代码演示样例，

//宿主文件：index.jsp

<%@ page language="java" pageEncoding="utf-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<%

	String path = request.getContextPath();

	String basePath = request.getScheme() + "://"

			+ request.getServerName() + ":" + request.getServerPort()

			+ path + "/";

%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<base href="<%=basePath%>">

<title>黑蓝首页</title>

<meta http-equiv="pragma" content="no-cache">

<meta http-equiv="cache-control" content="no-cache">

<meta http-equiv="expires" content="0">

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="This is my page">

<!-- <link rel="stylesheet" type="text/css" href="css/websiteFront.css">  -->

<style type="text/css">

.countLoginData {

	max-width: 100%;

	background-color: #f6f6f1;

	border-collapse: collapse;

	border-spacing: 0;

}

a {

	cursor: pointer;

}

</style>

<script src="js/jquery/jquery-1.11.3.js"></script>

<script src="js/jquery/jquery.blockUI.js"></script>

<script type="text/javascript">

    // 首页-登录

	function login() {

	}

    // 首页-注冊

	function register() {

	    var width = 600;

		var height = 400;

		try {

			$

					.blockUI({

						message : "<div id='registerMaskLayer'></div>",

						css : {

							top : ($(window).height() - height) / 2 + 'px', //遮罩层居中

							left : ($(window).width() - width) / 2 + 'px',

							width : width + 'px',

							height : height + 'px'

						},

						overlayCSS : {

							backgroundColor : '#F0F0F0',

						}

					});

		} catch (e) {

			alert(e);

		}

		$("#registerMaskLayer").load("register.jsp");

		return false;

	}

</script>

<script type="text/javascript">

	// 遮罩层-不注冊

	function noRegister() {

		$.unblockUI();

	}

	// 遮罩层-注冊

	function register1(){

// 	    var form = $("#register");

        var form = document.getElementById("register");

        var param = $("#register").serialize();

	    $.post(form.action,

	           param,

	           function(json){

	               if(json.success){

	                   alert("注冊成功！

");

	               }else{

	                   alert("注冊失败！

");

	               }

	           },

	           "json");

	}

</script>

</head>

<body>

	<!-- 搜索栏 -->

	<table style="margin-left:200px">

		<tr>

			<td id="websiteName" class="websiteName"

				style="font-size:14px;font-weight:bold">黑蓝作品</td>

			<td style="padding:5px;margin:20px"><input type="text"

				name="search" id="search" class="search"

				style="width:400px;height:30px" /></td>

		</tr>

	</table>

	<hr class="hrClass" />

	<!-- 菜单条 -->

	<table style="margin-left:180px">

		<tr>

			<td>

				<table>

					<!-- 菜单 -->

					<tr>

						<td style="margin:10px; padding:10px"><a><img

								src="images/novel.png" />

						</a>

						</td>

						<td style="margin:10px; padding:10px"><a><img

								src="images/suibi.png" />

						</a>

						</td>

						<td style="margin:10px; padding:10px"><a><img

								src="images/poem.png" />

						</a>

						</td>

						<td style="margin:10px; padding:10px"><a><img

								src="images/vision.png" />

						</a>

						</td>

						<td style="margin:10px; padding:10px"><a><img

								src="images/hasPublished.png" />

						</a>

						</td>

						<td style="margin:10px; padding:10px"><a><img

								src="images/pendingPublished.png" />

						</a>

						</td>

					</tr>

				</table></td>

			<td>

				<table style="margin-left:100px;">

					<!-- 登录和注冊 -->

					<tr>

						<td><a href="#" onclick="login()"><img

								src="images/login.png" />

						</a>

						</td>

						<td><a href="#" onclick="register()"><img

								src="images/register.png" />

						</a>

						</td>

					</tr>

				</table></td>

		</tr>

	</table>

	<!-- 统计登录数据 -->

	<table style="margin-left:170px">

		<tr>

			<td>

				<table class="countLoginData">

					<tr>

						<td>10000</td>

						<td>今日訪问次数</td>

					</tr>

					<tr>

						<td>3000</td>

						<td>当前正在訪问</td>

					</tr>

					<tr>

						<td>1000</td>

						<td>当前登录用户</td>

					</tr>

				</table>

			</td>

			<td>

				<table>

					<tr>

						<td>黑蓝奖</td>

						<td>中国最好的短篇小说奖</td>

					</tr>

					<tr>

						<td colspan="2">

							<hr />

						</td>

					</tr>

				</table>

			</td>

		</tr>

	</table>

	<!-- 菜单条 -->

	<table style="margin-left:170px">

		<tr>

			<td>

				<table>

					<!-- 推荐作者 -->

					<tr>

						<td>陈卫</td>

					</tr>

					<tr>

						<td>江冬</td>

					</tr>

					<tr>

						<td>水鬼</td>

					</tr>

					<tr>

						<td>孙智正</td>

					</tr>

					<tr>

						<td>曹寇</td>

					</tr>

				</table></td>

			<td>

				<table>

					<!-- 获奖作品 -->

					<tr>

						<td colspan="6">2015年第4季度</td>

					</tr>

					<tr>

						<td colspan="6">第28届·黑蓝奖</td>

					</tr>

					<tr>

						<td>获奖作品</td>

						<td>内向</td>

						<td>获奖作家</td>

						<td>江冬</td>

						<td>获奖感言</td>

						<td>感言题目</td>

					</tr>

					<tr>

						<td colspan="6">

							<div>感言内容</div>

						</td>

					</tr>

				</table></td>

			<td>

				<table>

					<!-- 颁奖语 -->

					<tr>

						<td>

							<div>颁奖语</div>

						</td>

					</tr>

					<tr>

						<td>

							<div>********************************</div>

						</td>

					</tr>

				</table></td>

		</tr>

	</table>

</body>

</html>

//server上的资源文件：register.jsp

<%@ page language="java" pageEncoding="utf-8"%>

<%@ taglib prefix="s" uri="/struts-tags"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>注冊遮罩层页面的内容</title>

<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">

<meta http-equiv="description" content="this is my page">

<meta http-equiv="content-type" content="text/html; charset=UTF-8">

<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

</head>

<body>

	<form name="register" id="register" action="login/register.action">

		<table>

			<tr>

				<td><s:textfield name="user.username" label="用户名" />

				</td>

			</tr>

			<tr>

				<td><s:textfield name="user.password" label="密码" />

				</td>

			</tr>

			<tr>

				<td><s:textfield name="user.email" label="邮箱" />

				</td>

			</tr>

		</table>

		<div>

			<input type="button" value="不注冊" onclick="noRegister();" />

			<input type="button" value="注冊  >>" onclick="register1();" />

		</div>

	</form>

</body>

</html>

load函数的更多相关文章

  1. 利用Jquery的load函数实现页面的动态加载

    利用Jquery的load函数实现页面的动态加载  js的强大功能相信大家都知晓,今天通过jquery的库函数load可以更加方便的实现页面的动态刷新,经过几天的研究与探索,终于有所成效!吾心甚蔚! ...

  2. EasyUI之Form load函数IE8下设置Radio或Checkbox的BUG

    EasyUI的form的load函数很好用,表单赋值就靠它了,简单方便.我们可以指定url以Ajax加载,如: 1: $('#ff').form('load', 'ajax/common') JSON ...

  3. 解决load 函数无法赋予变量名的问题

    以前非常喜欢使用load函数,因为简单,而且存储相对较大的matrix.list文件更为方便.但是load函数有一个问题是在使用其过程中无法对其载入的data赋予变量名: # save data x ...

  4. c++ 中CImage类Load函数，路径中含有空格应对策略!

    最近,在写一些东西的时候,需要用到CImage类将JPG各式的图片转换成BMP图片,传入的是图片的绝对地址:如C:\Users\Administrator\Documents\Visual Studi ...

  5. jQuery的load函数是异步的

    今天使用load函数的时候,用它加载页面,再修改页面样式,但是没有成功,上网查了一下,原来是异步的,也就是说之后的代码不会等页面加载完再执行,有可能先执行,这就找不到元素了. 解决方法,利用load函 ...

  6. Json模块dumps、loads、dump、load函数介绍

    转自:http://blog.csdn.net/mr_evanchen/article/details/77879967 Json模块dumps.loads.dump.load函数介绍 1.json. ...

  7. Matlab中save与load函数的使用

    用save函数,可以将工作空间的变量保存成txt文件或mat文件等. 比如: save peng.mat p j 就是将工作空间中的p和j变量保存在peng.mat中. 用load函数,可以将数据读入 ...

  8. Python中的Json模块dumps、loads、dump、load函数介绍

    Json模块dumps.loads.dump.load函数介绍 1.json.dumps() json.dumps() 用于将dict类型的数据转成str,因为如果直接将dict类型的数据写入json ...

  9. js进阶 14-3 如何接收load函数从后台接收到的返回数据

    js进阶 14-3 如何接收load函数从后台接收到的返回数据 一.总结 一句话总结:load方法的回调函数的参数即可接收从后台的返回数据. 1.load方法的回调函数的参数是什么? 语法:load( ...

随机推荐

  1. EasyUI系列学习(六)-Tooltip（提示框）

    一.创建组件 0.Tooltip不依赖其他组件 1.使用class加载 <a href="#" class="easyui-tooltip" title= ...

  2. scala-基础-映射(1)

    //映射(1)-构建,获取,更新,迭代,反转,映射(可变与不可变 互换) class Demo1 extends TestCase { //构建与获取 def test_create_^^(){ // ...

  3. Scala-基础-函数(2)

    import junit.framework.TestCase //函数(2) //知识点-默认参数,带名参数,变长参数,过程 class Demo1 extends TestCase { //测试方 ...

  4. PHP语言开发Paypal支付demo的具体实现

    如果我们的应用是面向国际的.那么支付的时候通常会考虑使用paypal.以下为个人写的一个paypal支付示例,已亲测可行.paypal有个很不错的地方就是为开发者提供了sandbox(沙箱)测试功能. ...

  5. 2559. [NOIP2016]组合数问题

    [题目描述] [输入格式] 从文件中读入数据. 第一行有两个整数t, k,其中t代表该测试点总共有多少组测试数据,k的意义见[问题描述]. 接下来t行每行两个整数n, m,其中n, m的意义见[问题描 ...

  6. IDEA提示 found duplicate code

    原因: IntelliJ IDEA提示Found duplicated code in this file 这不是我们代码错误,而是idea提示说我们的代码有重复,在项目的其他地方有同样的代码片段 解 ...

  7. [Testing][API][soapUI] 測試API 的軟體工具紀錄

    soapUI 測試API 的軟體工具紀錄 http://files.cnblogs.com/vincentmylee/soapUIScript%E9%9C%80%E8%A6%81%E8%B3%87%E ...

  8. Linux 学习（四）

    搭建jdk 安装jdk操作: 1.光驱挂载:mount /dev/cdrom /mnt 2.拷贝安装包至其他文件夹(如home目录下) 3.执行安装包(bin包:./包名) 4.配置环境变量:打开文件 ...

  9. PHP引用（&）的考察点

    引用的概念 在PHP中引用意味着用不同的名字访问同一个变量内容. 定义方式 使用 & 符号来表示 变量的引用 $a = 'ABC'; //开辟一块内存空间存储数据,$a指向该空间 $b = & ...

  10. codeforces_455B

    B. A Lot of Games time limit per test 1 second memory limit per test 256 megabytes input standard in ...