一，首先，制作jQuery插件需要一个闭包
复制代码 代码如下:
(function ($) {
//code in here
})(jQuery);
这是来自jQuery官方的插件开发规范要求，使用这种编写方式有什么好处呢？
a) 避免全局依赖。
b) 避免第三方破坏。
c) 兼容jQuery操作符'$'和'jQuery '
二，有了闭包，在其中加入插件的骨架
复制代码 代码如下:
$.fn.dBox = function (options) {
var defaults = {
//各种属性及其默认值
};
var opts = $.extend(defaults, options);
//function codes in here
};
在这里dBox是我为这个弹出层插件的命名
三，为dBox建立起属性及其默认值
复制代码 代码如下:
$.fn.dBox = function (options) {
var defaults = {
opacity: 0.6, //for mask layer
drag: true,
title: 'dBox',
content: '',
left: 400,
top: 200,
width: 600,
height: 300,
setPos: false, //if use the customer's left and top
overlay: true, //if use the mask layer
loadStr: 'Loading',
ajaxSrc: '',
iframeSrc: ''
};
var opts = $.extend(defaults, options);
//function codes in here
};
四，既然是弹出窗体，那么要先设计好一个div窗体和遮罩层，在这里我将样式也直接写进去了，在function codes区域中输入如下：
复制代码 代码如下:
//build html code of the dBox
var dBoxHtml = "";
dBoxHtml += "";
dBoxHtml += "" + opts.title + "";
dBoxHtml += "[x]";
dBoxHtml += "";
dBoxHtml += "" + opts.content + "";
dBoxHtml += "";
var dBoxBG = "";
var loading = "" + opts.loadStr + "";
在IE6中，z-index对下拉列表不会起作用，所以这里遮罩层中加入id为d_iframebg的iframe作为遮罩层，这样，大体已经制作好了框架。
五，现在我们考虑要实现什么功能了
首先，如何出现弹出窗体，一般都是点击，这里仍然使用点击事件
复制代码 代码如下:
//click event
$(this).click(function () {
$("body").append(dBoxHtml);
//case ajax
if (opts.ajaxSrc != "") {
$("#d_content").append("");
$("#d_ajaxcontent").load(opts.ajaxSrc);
}
//case iframe
else if (opts.iframeSrc != "") {
$("#d_content").append("