jQuery弹窗插件 AsyncBox

什么是 jQuery.AsyncBox ?

jQuery.AysncBox（异步盒子。以下简 称：AysncBox）是一款基于 jQuery 的弹窗插件。能够实现网站的整体风格效果，给用户一个新的视觉享受。主要模拟常用的 alert、confirm、prompt、open 和扩展了一些对话框。它通过回调函数触发事件动作并执行，使操作区域更加明了、统一。而且能够在主流浏览器中灵活运用。

插件特点

多元化组合

AysncBox 集成了 alert、confirm、prompt、open 和扩展了一些对话框。犹如十八般武艺集于一身。

多模态窗口

采用无限极设计思路，实现多模态与非模态的窗口组合，能够在互不干扰的情况下完成相对复杂的操作。

全方位定位

支持静止定位、自定义位置、自动修复位置。极大的灵活性。给用户一种良好的视觉体验效果。

自定义皮肤

AsyncBox 架构采用九宫格布局，使得在构造盒子时具有丰富灵活的样式钩子，轻松实现不同肤色的窗口。

跨框架互通

支持无限极层叠 iframe 框架或 frameset 框架集调用，在本域框架中穿梭自如，无需复杂的配置就能轻松实现。

快速简便

简洁的调用方式，丰富的 API，秒速的上手易度。帮助你轻松驾驭 AsyncBox。

• [2011-5-15] AsyncBox v1.4 版本更新
• - 新增
• 1、$.returnValue 返回值。强化跨域与窗口之间的数据互通。
• 2、$.tips(...) 提示加入“success” 和“error”图标配置和关闭秒数。
• 3、$.open(...) 函数加入 data 选项一个，用于发送到服务器的数据。
• - 调整
• 1、所有 AsyncBox 窗口显示位置均提升为“黄金比例居中”。
• 2、对话框内容超出浏览器时，窗口压缩为浏览器可见高度。
• 3、对话框内容超多时排版不美观现象。出现滚动条时，提示图标为不跟随。
• 4、按钮构建内核修改为 A 标签，同时支持自适应，字数限制进行了扩充。
• 5、对 $.tips(...) 提示窗口进行了增肥。
• 6、固化 $.open(...) 中 HTML 模式在设置高宽时的限制。
• - 修复
• 1、$.reload(...) 函数在内容页中，使用分页导致 url 动态改变后，重载不正确的 BUG。
• 2、在傲游3中的非兼容模式下用 textarea 的 focus 事件调用 AsyncBox 时窗口呈现不正确的 BUG。
• - 优化
• 1、对部分函数中的冗余代码进行了优化。
• 2、对 $.open(...) 内置的 wait 效果进行了优化。
• 3、对样式文件和图片进行了优化。
• 常见问题：

  可以在项目中使用 AsyncBox 吗？

  可以。在遵循相关协议的条件下，AsyncBox 无偿的提供给大家永久免费使用权。详情可以阅读 许可协议 。

  AsyncBox 和其他弹窗组件有什么不同吗？

  番茄和西红柿没什么不同。关键是看你是炒鸡蛋呢还是炒土豆马铃薯。

  为什么在调用 AsyncBox 时中文会出现乱码？

  AsyncBox 的文件编码是 UTF-8 的，在遇到其他编码类型时可能会出现乱码现象，解决办法可以在引用 AsyncBox 时加上 charset="utf-8"。例如：

  为什么 AsyncBox 不支持“if(asyncbox.confirm('Are you ok?')){...}else{...}”这种判断方式？

  AsyncBox 对事件的操作是通过回调函数实现的，模拟不了阻塞，所以无法支持这种调用方式。

  为什么 AsyncBox 不支持“最大化”？

  很遗憾，在历来更新 AsyncBox 中都没有提到支持“最大化”，但是可以通过 width、height 配置一个全屏的窗口，在 resize 中使用 $.size 修复。这样至少可以弥补一下缺陷。另外 AsyncBox 当然不会放弃这个支持，在往后的版本中将看到。

  AsyncBox 支持 IPAD 移动设备浏览吗？

  目前 AsyncBox 对手机浏览产生的不理想效果没有做相关定制。不建议在 IPAD 移动设备中使用 AsyncBox 集成开发。

  为什么 AsyncBox 在 windows 7 系统下字体会显得很粗糙？

  系统本身对中文字体的解析就那样。如果想达到更理想的视觉效果，可以了解相关的系统美化资源。

  为什么 AsyncBox 在内容页中不能第一时间直接调用？

  在内容页或者在 iframe 内中不需要事件触发调用 AsyncBox 时，例如“parent.asyncbox.alert('Hello AsyncBox !');”，这样会报“缺少对象”的错误，原因是内容页未加载完毕。解决方案为：setTimeout(function() {parent.asyncbox.alert('Hello AsyncBox !');},1000); 推荐延迟加载，尽量避免 AsyncBox 和页面同时加载，既等页面加载完毕后再弹出也不迟。

  为什么在项目中载入 AsyncBox 后窗口布局会变得凌乱？

  AsyncBox 的构建内核使用了 table 和 部分 a 标签，如果你对 table 和 a 标签进行了全局样式设置的话，可能会对 AsyncBox 造成影响。虽然 AsyncBox 也内置固化了部分样式，但总的来说设置全局样式并不是很好的编码习惯，所以建议尽量避免定义全局样式的写法。

  为什么对话框的内容不能换行？

  避免内容出现连续没有空格的字符串，如 “StringStringStringStringStringStringString...”。

  为什么 AsyncBox 不能遮住 FLASH？

  FLASH 相对比较特殊，如果需要遮住它的话，由开发人员决定在引用 FLASH 时是否加入   参数。

  为什么 AsyncBox 出现靠左上角，不能拖动？

  缺少文档声明。另外，避免在声明顶部 出现 UFO。

  为什么透明类的皮肤在 IE6 下显示不出来？

  AsyncBox 目前就内置了一款 ZCMS 的透明皮肤，在 IE6 下需要对 asyncbox.css 文件中的路径做绝对于当前页面的路径配置。例如：src='asyncbox/skins/ZCMS/images/ie6 /dialog_lt.png'，asyncbox.html && asyncbox文件夹，即文档页面与 asyncbox 文件夹呈同级目录。

  为什么出现 “asyncbox 未定义”或者其他未定义错误？

  出现此类错误，请检查你配置的插件路径是否正确。

  为什么按钮按下后变为不可用状态了？

  按钮做了 disabled 处理，简单保证了事件单次执行，避免重复执行。执行完毕后会变为可用状态。如果按钮按下后变为不可用，那说明在执行的过程中出错了，请检查你的代码。

  为什么会报 “缺少标识符、字符串或数字” 或 “未结束的字符串常量”？

  IE 下在配置 $.open(...) 参数时避免参数配置中缺少逗号或者最后一个参数后面出现逗号。

  CHM 帮助文档无法显示？

  关于 CHM 帮助文档无法显示问题，由于系统安全性的影响，可能会造成某些 CHM 帮助文档无法显示页面内容。

  解决方法：

  1）右键文档 - 解除锁定。

  2）打开文档时选择“运行”。

  如还未能解决就百度或谷歌了。

  AsyncBox 开源吗？

  自 AsyncBox 发布以来受到社会各界的关注和支持，而且随着版本的不断更新，AsyncBox 已经能够在项目中尽以一份微薄之力。AsyncBox 的源码也在不断的改进，相信在不久的将来 AsyncBox 就可以和大家见面了。

  
  操作流程遇到的问题：

  如何取得当前 AsyncBox 窗口ID？

  AsyncBox 的回调函数处理机制为 callback 在 callback 中可以使用 this.id 得到当前 AsyncBox 的 ID。如果该 AsyncBox 被嵌套使用，那么 this 对象会被子 AsyncBox 覆盖，此时需得到正确的 ID ，则需将 this 对象存起来，例如：var id = this.id; 再用。
  另外对话框类窗口ID为 asyncbox_ + [alert,confirm,success,error,prompt]。

  如何将表单提交表单到 AsyncBox 窗口处理？

  在 form 中设置 target 指向 AsyncBox 中的 iframe。例如：

  ，AsyncBox 中的 iframe ID 为 窗口ID + _content，即 “openName_content”。

  操作 AsyncBox 后如何刷新页面？

  在判断 action 值内加入需要刷新页面的代码“window.location.reload()”。内容页刷新父页面：“top.window.location.reload()"。 如何刷新页面？

  如何在程序后台中调用 AsyncBox？

  通过 AJAX。