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. mysql的简单优化【简单易学】

    1.选取最适用的字段属性: 表字段尽量设小,不要给数据库增加没必要的空间:如:值为'01'.'02',给char(2)即可: 2.使用连接(JOIN)来代替子查询(Sub-Queries): 使用jo ...

  2. C#随机取部分数据

    1.使用Random伪随机生成器 但是这样会由于转换为数组类型导致性能下降,千万要避免这种用法. 2.使用Take返回重头开始指定数量的连续元素 每次进来这个方法的时候,都使用Guid进行一次排序,然 ...

  3. ReLU激活函数：简单之美

    出自 http://blog.csdn.net/cherrylvlei/article/details/53149381 导语 在深度神经网络中,通常使用一种叫修正线性单元(Rectified lin ...

  4. C++（extern关键字的理解和作用深入）

    extern关键字的理解和作用深入 extern是一个关键字,它告诉编译器存在着一个变量或者一个函数,如果在当前编译语句的前面中没有找到相应的变量或者函数, 也会在当前文件的后面或者其它文件中定义 引 ...

  5. windows多线程应用编程注意事项

    1,资源争用保护 对于文件操作.界面资源.GDI操作等一般由主线程完成的任务,要加以顺序化处理(serialization),即一个资源一次只能由一个线程访问,多个线程同时访问将导致错误. 方法一般可 ...

  6. Linux 学习（四）

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

  7. webSql的简单小例子

    初始化websql数据库的参数信息 var config = { name: 'my_plan', version: '', desc: 'manage my plans', size: 20 * 1 ...

  8. DWARF调试格式的简介

    DWARF调试格式的简介 Michael J. Eager, Eager Consulting Feb, 2007 翻译:吴晖 2012年2月 如果我们可以编写确保能正确工作且永远不需要调试的程序,这 ...

  9. MFC_1.2 消息映射宏 数据绑定和交换

    消息映射宏 有三个主要的宏 类内声明 DECLARE_MESSAGE_MAP 表示使用消息映射 在CPP文件中使用 BEGIN_MESSAGE_MAP 和 END_MESSAGE_MAP 包含对应的消 ...

  10. 安卓app测试之启动时间和电量监控

    一.启动时间监控 通过adb命令获取 adb shell am start -W /<packageName> /<activityName> 案例: adb shell am ...