<html>
<head>
<link href="${cssPath}/facebox.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript"
src="${jsPath}/jquery-1.3.2.js"></script>
<script language="javascript" type="text/javascript"
src="${jsPath}/facebox.js"></script>
<script language="javascript" type="text/javascript">
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({closeResults:1});
}
</script>
</head>
<body>
<table cellspacing="0" cellpadding="0" border="0" class="listData">
<tbody>
<tr>
<th scope="col">创建用户</th>
<th scope="col" width="500">模板消息</th>
<th scope="col">操作</th>
</tr>
<c:forEach items="${smsTemplatesList}" var="smsTemplates"
varStatus="status_smsTemplate">
<tr>
<td>${smsTemplates.createUser.name}</td>
<td>${smsTemplates.message}</td>
<td><a id="${smsTemplates.id}" href="sms.lps?method=toTemplatesEdit&smsTemplates.id=${smsTemplates.id}" rel="facebox" >修改</a></td>
</tr>
</c:forEach>
</tbody>
</table>
<a href="sms.lps?method=toTemplatesAdd" id="add" rel="facebox">添加短信模板</a>
</body>
</html>
上面有一些JSTL的动态代码，我没有去掉
给要在弹出层显示数据的请求<a>都加上
rel="facebox"
这种主要是给他们一个集体标识，好用JQUERY找到他们，然后在页面加载后调用代码就OK了
jQuery(document).ready(function($) {
$('a[rel*=facebox]').facebox({closeResults:1});
}
如要进行手动关闭，调用
$.facebox.close();
这里有个问题，我多给了一个参数，这个参数在官方下载的角本文件是无效的facebox进行了一个小小的修改，让弹出层的关闭方式可以进行一些简单的控制
在原文件中的90行添加
closeResults : 0,
在原文件中的299行添加
if ($.facebox.settings.closeResults == 0)
$('#facebox_overlay').click(function() { $(document).trigger('close.facebox') })
添加一种属性，可设置弹出层关闭效果，现可通过closeResults属性，
当不进行设置或等于0时，鼠标点击弹出层外面时，弹出层关闭，
当设置为1时，鼠标点出弹出层外面时，不操作，只可点击设置好的图标和按钮才可关闭
附件中是我修改后的文件
分享到：
相关推荐
要触发Facebox弹出层，可以将链接或按钮的`rel`属性设置为`facebox`，例如：`<a href="your_content.html" rel="facebox">打开弹出层</a>`。点击这个链接时，Facebox会加载指定URL的内容并显示。 6. **加载动态...
总的来说，jQuery Facebox是一个强大且易于使用的弹出层插件，它能为网页增添互动性和美观性，是网页设计和开发者的得力工具。通过熟练掌握和应用Facebox，可以提升用户体验，使网站更加吸引人。
一个js弹出层特效，可用于网页提示框、弹出层、登录框都可以使用，核心使用了Facebox吧，点击上面的文字就可弹出该提示框，可点击“X”号关闭该弹出层，这个层兼容各大浏览器，只是有一点还需要改进，我喜欢可以拖动...
在这个案例中，它使用了流行的JavaScript库jQuery，来实现动态、优雅的弹出层效果。 jQuery是一个轻量级的JavaScript库，简化了HTML文档遍历、事件处理、动画以及Ajax交互。它通过提供简洁的API，使得开发者能够...
本文将深入探讨jQuery弹出层插件，包括thickbox、colorbox、facebox、jqueryalert和shadowbox，这些都是用于创建美观、交互性强的弹出窗口的优秀工具。 首先，我们来看thickbox。Thickbox是一款基于jQuery的全屏弹...
内容索引:脚本资源,jQuery,facebox Facebox 基于jQuery的一款带动画特效的华丽弹出层插件，当然华丽还是需要你去实现的，它只提供一些方法和效果，比如渐入渐出显示层，折叠展开等，本例这个不很华丽，只是为了测试...
但是，这也导致了当弹出层中包含表格布局时，很容易受到facebox样式的干扰，需要额外的样式重置工作。 ThickBox插件的基本使用方法包括： - 单张图片展示：通过给链接元素添加class="thickbox"属性，并指定要展示...
Facebox提供了一个简洁的API，允许开发者轻松地在网页上添加类似于Facebook的弹出式对话框。 1. **Facebox的实现原理** Facebox通过CSS和JavaScript实现，利用jQuery选择器和事件处理来定位、显示和隐藏提示框。它...
首先，灯箱（Lightbox）是一种在网页上展示大图或多媒体内容的弹出式界面，通常用于图片预览或视频播放。Facebook的灯箱设计简洁且用户体验良好，用户可以在不离开当前页面的情况下查看或互动。 要创建一个Facebook...
Facebox是一个流行的jQuery插件，它允许开发者将链接、图像或HTML内容包装在一个弹出的对话框中。这个1.1版本可能包含了对原版Facebox的改进，比如修复了已知问题，增加了新特性，或者优化了性能。 使用Facebox 1.1...
id : 'facebox', // 弹出层ID path : 'path/to/your/expressions/', // 表情存放路径 click : function(iframeId, imgSrc){ // 当点击某个表情时触发，可以在这里处理插入表情的逻辑 $('#inputBox').val($('#...