0

私は単純な構造を持っています(複雑なページではありますが、OKです)必要に応じてカラーボックスを使用して表示されるいくつかのajax回答用のtasコンテナを使用するdivがあります

<div style = "display: none;">
<div id="modal"></div>
</div>

そして、次のスクリプト(一部)

$.colorbox({
    onOpen: function() {
        $("#modal").html("Attendere prego...");
    $("#modal").fadeIn;
    },
    onClose: function() {
        $("#modal").html("Attendere prego...");
        $("#modal").fadeOut;
    },
    inline: true,
    href: "#modal",
    close: "Chiudi",
    transition: "fade",
    opacity: 0.6,
    width: "600px",
    height: "100px",
    maxWidth: "500px",
    maxHeight: "500px",
});

この後、私は ajax 呼び出しを行い、#modal 内に結果 (html フラグメント) を入れました。

ページをロードすると、モーダルをクリックして開いてデータまたは空の場合はメッセージを表示し、再度クリックしても何も起こりません...クロムのツールを使用してDOMを調査したところ、最初の使用後に以前のhtmlが次のようになったことがわかりました。

<div style="display: none;">
    <div style="display: none;"></div>
</div>

私はカラーボックスをよく使っていましたが、このような他のケースは覚えていません。

4

2 に答える 2

0

このようにすることができます:

あなたのHTMLで:

<div id="modal" style="display:none">
</div>

そしてあなたのスクリプト:

$.colorbox({
    onOpen: function() {
        $("#modal").html("Attendere prego...");
    $("#modal").fadeIn(); // fadeIn function
    },
    onClose: function() {
        $("#modal").html("Attendere prego...");
        $("#modal").fadeOut(); //fadeOut function
    },
    inline: true,
    href: "#modal",
    close: "Chiudi",
    transition: "fade",
    opacity: 0.6,
    width: "600px",
    height: "100px",
    maxWidth: "500px",
    maxHeight: "500px",
});
于 2013-09-13T09:02:36.813 に答える