JQuery Dialog不显示按钮

时间:2013-08-28 13:37:29

标签: jquery button modal-dialog jquery-ui-dialog

我正在初始化document.ready()函数中的一个对话框,把OK按钮放在页面上不显示。这是一个非常直接的事情,只是不确定发生了什么。

$(document).ready(function(){
//var popupWindow = window.open('P360TradingVideos.asp','P360TradingVideos','height=400,width=510,status=no,toolbar=no,menubar=no,resizable=no,location=no,scrollbars=no');

$("#videoPlayerDiv").dialog({
    position: "center",
    resizable: true,
    autoResize: true,
    draggable: false,   
    modal: true,
    buttons: {
        "Ok": function(){
            $(this).dialog("close");
        }
    }
});

})

这里是div

<div id="videoPlayerDiv">
    <div id="videoTable">
        <table>
            <tr>
                <td><b>Trading Videos</b></td>
            </tr>
            <tr>
                <td>--></td><td><a href="#" onclick="playVideo('tradingOverview');">Trading Overview</a></td>
            </tr>
            <tr>
                <td>--></td><td><a href="#" onclick="playVideo('multiAccount');">Multi-Account Trading Wizard</a></td>
            </tr>
            <tr>
                <td>--></td><td><a href="#" onclick="playVideo('globalUnlock');">Global Unlock</a></td>
            </tr>
        </table>
    </div>
    <div id="videoPlayer" style="display:none; height: 250px; width: 250px;">

    </div>
</div>

在页面加载时正确弹出对话框,但不显示“确定”按钮。另外,这里是我编写的两个函数来填充videoPlayer div,以防万一可能导致问题,我并不熟悉对话框结构。 谢谢你的帮助

function playVideo(x){
    $("#videoTable").attr("style","display:none;");
    $("#videoPlayer").attr("style","display:block;");
    $("#videoPlayer").html("");

    var videoToPlay = x;
    switch(videoToPlay){
        case 'tradingOverview':
            //alert(videoToPlay);
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='Wildlife.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='Wildlife.wmv'><param name='filename' VALUE='Wildlife.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='Wildlife.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
        break;
        case 'multiAccount':
            //alert(videoToPlay);
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='BabyBoyMainBackground.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='BabyBoyMainBackground.wmv'><param name='filename' VALUE='BabyBoyMainBackground.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='BabyBoyMainBackground.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
        break;
        case 'globalUnlock':        
            var newElement = "<object id='objViewer' width='250' height='250' type='video/x-ms-asf' data='Panel_Mask.wmv' classid='CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6'><param name='url' value='Panel_Mask.wmv'><param name='filename' VALUE='Panel_Mask.wmv'><PARAM name='autostart' VALUE='0'><param name='uiMode' value='full'><param name='autosize' value='1'><param name='playcount' value='1'><EMBED TYPE='application/x-mplayer2' src='Panel_Mask.wmv' NAME='MediaPlayer' id='wmvViewer' autostart='false' WIDTH='250' HEIGHT='250' ShowControls='1' ShowStatusBar='0' ShowDisplay='0'></EMBED></OBJECT><br/><a onclick='returnVideos();'>Return to Videos</a>";
            $("#videoPlayer").html(newElement);
            //alert(videoToPlay);
        break;
    }
}
function returnVideos(){
    $("#videoTable").attr("style","display:block;");
    $("#videoPlayer").attr("style","display:none;");
}

2 个答案:

答案 0 :(得分:1)

DEMO:

http://jsfiddle.net/h5zkb/

<div> I just copied your code and the button "OK" is showing up.  </div> 

答案 1 :(得分:0)

我想通了,这是一个继承的样式问题来自不同的外部样式表,其中按钮窗格和按钮属性设置为display:none;这是我的错,这不是我的原始代码,所以我不知道外部关联。感谢您对小提琴的帮助,我一定会提供前进的小提琴并在那里进行自己的测试。再次感谢