當(dāng)我在一個(gè)項(xiàng)目中使用Colorbox jQuery插件和ASP.NET時(shí)，遇到了一個(gè)奇怪的問(wèn)題。問(wèn)題不僅是Colorbox，而且還與另一位著名的插件Fancyox有關(guān)。如果你只打算使用插件顯示對(duì)話框，那么這個(gè)插件工作完全正常。如果你在colorbox對(duì)話框中的服務(wù)器控件（這實(shí)際上是一種在頁(yè)面上不可見(jiàn)的div），與ASP.NET集成的插件工作正常，但是它會(huì)阻止回傳。 ASP.NET開(kāi)發(fā)人員可以認(rèn)為這是一個(gè)錯(cuò)誤，但實(shí)際上它是不是一個(gè)錯(cuò)誤，而是一種情景錯(cuò)過(guò)的插件。更多jQuery文章

我有一個(gè)按鈕，點(diǎn)擊“Yes”將重定向到關(guān)于頁(yè)面。現(xiàn)在，當(dāng)你嘗試點(diǎn)擊一下按鈕，不會(huì)有任何回傳事件。這是因?yàn)镃olorbox呈現(xiàn)的“div”標(biāo)簽在“form”標(biāo)簽外，阻礙了回傳事件。

現(xiàn)在要解決這個(gè)問(wèn)題，你需要跳轉(zhuǎn)到Colorbox插件代碼中。添加這些內(nèi)容到DOM或在頁(yè)面上的主要函數(shù)被稱為appendHTML。

function appendHTML() {
    if (!$box && document.body) {
        init = false;
 
        $window = $(window);
        $box = $tag(div).attr({ id: colorbox, 'class': isIE ? prefix + 
           (isIE6 ? 'IE6' : 'IE') : '' }).hide();
        $overlay = $tag(div, "Overlay", isIE6 ? 'position:absolute' : '')
           .hide();
        $wrap = $tag(div, "Wrapper");
        $content = $tag(div, "Content").append(
            $loaded = $tag(div, "LoadedContent", 'width:0; height:0; 
                overflow:hidden'),
            $loadingOverlay = $tag(div, "LoadingOverlay").add($tag(div, 
                "LoadingGraphic")),
            $title = $tag(div, "Title"),
            $current = $tag(div, "Current"),
            $next = $tag(div, "Next"),
            $prev = $tag(div, "Previous"),
            $slideshow = $tag(div, "Slideshow").bind(event_open,
                 slideshow),
            $close = $tag(div, "Close")
        );
 
        $wrap.append( // The -1x3 Grid that makes up ColorBox
            $tag(div).append(
                $tag(div, "TopLeft"),
                $topBorder = $tag(div, "TopCenter"),
                $tag(div, "TopRight")
            ),
            $tag(div, false, 'clear:left').append(
                $leftBorder = $tag(div, "MiddleLeft"),
                $content,
                $rightBorder = $tag(div, "MiddleRight")
            ),
            $tag(div, false, 'clear:left').append(
                $tag(div, "BottomLeft"),
                $bottomBorder = $tag(div, "BottomCenter"),
                $tag(div, "BottomRight")
            )
        ).find('div div').css({ 'float': 'left' });
 
        $loadingBay = $tag(div, false, 'position:absolute; 
                width:9999px; visibility:hidden; display:none');
 
        $groupControls = $next.add($prev).add($current).add($slideshow);
 
        $(document.body).append($overlay, $box.append($wrap, 
                $loadingBay));
    }
}

在上面的方法中（這是從插件中摘取的），注意該插件的重點(diǎn)是document.body，而為了使回傳事件工作我們需要作如下修改：

將上面

“if (!$box && document.body) {”

改為

“if (!$box && document.forms[0]) {”

以及

將上面

“$(document.body).append($overlay, $box.append($wrap, $loadingBay));”

改為

“$(document.forms[0]).append($overlay, $box.append($wrap, $loadingBay));”

完成更改后，現(xiàn)在是時(shí)候再次檢查了。按一下按鈕，并再次檢查。這次會(huì)被重定向到關(guān)于頁(yè)面。雖然這似乎是一個(gè)簡(jiǎn)單的問(wèn)題，但仍有一些老程序員會(huì)因?yàn)檫@個(gè)問(wèn)題而頭痛。希望這篇文章對(duì)你有所幫助。