jQuery 工具的叠加层是一个很好的显示 div 的 webhelper。通常,我们建议在 jquery ready 函数中注册覆盖。它在我身边运作良好。
现在我想即时注册覆盖。我是说:
- 我动态创建了一个 div,用于加载我的内容。
- 然后我使用新创建的 div 来注册覆盖。
- 最后一件事是触发事件。
下面是我的示例代码:
<pre><code>
function RegisterOverlay(divId) {
$("#" + divId).overlay({
mask: {
color: '#789',
loadSpeed: 200,
opacity: 0.7
},
load: true,
onBeforeLoad: function () {
document.getElementById(divId).style.width = overlayConf.width;
document.getElementById(divId).style.height = overlayConf.height;
this.getConf().top = overlayConf.top;
this.getConf().oneInstance = true; //overlayConf.oneInstance;
this.getConf().closeOnClick = overlayConf.closeOnClick;
this.getConf().closeOnEsc = overlayConf.closeOnEsc;
this.getConf().top = overlayConf.top;
this.getConf().effect = overlayConf.effect;
this.getConf().fixed = overlayConf.fixed;
this.getConf().speed = overlayConf.speed;
this.getConf().mask.color = overlayConf.Mask.color;
this.getConf().mask.loadSpeed = overlayConf.Mask.loadSpeed;
this.getConf().mask.opacity = overlayConf.Mask.opacity;
this.getConf().mask.colseOnEsc = overlayConf.Mask.colseOnEsc;
this.getConf().mask.colseOnClick = overlayConf.Mask.colseOnClick;
var wrap = this.getOverlay().find(".contentWrap");
wrap.load(overlayConf.url);
},
onClose: function () {
var overlayAll = document.getElementById("overlayAll");
overlayAll.removeChild(document.getElementById(divId));
}
});
}
function ParentOverlay(conf, divId) {
overlayConf = conf;
CreateDiv(divId);//create a div based on a given id
RegisterOverlay(divId);//
}
上述代码托管在父页面上,因此每个子页面都可以通过一些参数调用 ParentOverlay 函数。抱歉我的英语不好,子页面托管在 iframe 中。框架是否会导致以下问题?
我的问题:
有一个非常子页面,我有三个按钮。单击其中任何一个都会触发具有不同参数的 ParentOverlay。
成功加载页面后,我单击第一个按钮,一切正常,我关闭了覆盖,但之后我再次尝试单击三个按钮中的一个。错误来了:
对象不支持属性或方法“覆盖”
这发生在我尝试注册覆盖的地方:
$("#" + divId).overlay(...
顺便提一句。按钮没有任何问题,这与我单击按钮的顺序无关。
很简单:第一次点击就可以了。然后一切都糟透了。
我对此进行了调试,我发现如果我只是硬编码三个按钮的三个 div 并在 jquery 就绪函数中注册三个覆盖。无论我点击多少次按钮,一切都很好。但这是一个我不能接受的紧急解决方案。我想即时制作并重用代码。
我还尝试将 load 属性设置为 false。这是没有意义的。
现在,我真的不知道该怎么做。也许有一些特殊的设置,但我还不知道。
这里的任何人都可以分享一些经验给我一些线索。
任何帮助是极大的赞赏。