jQuery ツールのオーバーレイは、div を表示するための優れた Web ヘルパーです。通常は jquery ready 関数にオーバーレイを登録することをお勧めします。そして、それは私の側でうまく機能します。
ここで、オーバーレイをオンザフライで登録したいと思います。つまり：
- content のロードに使用する 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 でホストされています。フレームは次の問題を引き起こしますか?
私の質問：
非常に子ページがあり、そこに 3 つのボタンがあります。それらのいずれかをクリックすると、さまざまなパラメーターで ParentOverlay がトリガーされます。
ページが正常にロードされた後、最初のボタンをクリックすると、予想どおりすべてが AOK になり、オーバーレイを閉じますが、その後、3 つのボタンのいずれかをもう一度クリックしようとしました。エラーが発生します：
オブジェクトはプロパティまたはメソッド「オーバーレイ」をサポートしていません
これは、オーバーレイを登録しようとすると発生します。
$("#" + divId).overlay(...
ところで。ボタンに問題はありません。これは、ボタンをクリックする順序とは関係ありません。
それは簡単です。最初のクリックでOKです。その後、すべて吸う。
これをデバッグしたところ、3 つのボタンの 3 つの div をハードコーディングし、3 つのオーバーレイを jquery ready 関数に登録するだけであることがわかりました。ボタンを何回クリックしても大丈夫です。しかし、これは私が受け入れることができない緊急の解決策です。その場で作成してコードを再利用したい。
また、load プロパティを false に設定しようとしました。そしてそれは意味がありません。
今、私は本当にどのように、何をすべきかわかりません。特別な設定があるのかもしれませんが、まだわかりません。
ここで誰かが私に少し手がかりを与えるいくつかの経験を共有できますか.
どんな助けでも大歓迎です。