jquery ui对话框没有关闭?

时间:2012-08-04 08:44:28

标签: jquery asp.net-mvc-3 jquery-ui-dialog

我不能让我的对话关闭,我在这里做错了什么?我想在我的asp.net mvc 3应用程序中集成这个脚本吗?

<p id="dialog_link" style="cursor: pointer;">
    Open Dialog
</p>
<div id="Dialog" title="Dialog title!" style="display: none;">
    @*  @{Html.RenderAction("Categories");}*@
    @{Html.RenderAction("About");}
</div>
<link href="../../Content/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/jquery-1.5.1.js" type="text/javascript"></script>
<script src="../../Scripts/jquery-ui-1.8.11.min.js" type="text/javascript">
</script>
<script type language="javascript">

    $(function () {
        var execute = function () {
            //alert('This is Ok button');
        };
        var cancel = function() {
            //alert('This is Cancel button');
            $("#Dialog").dialog('close');
        };
        var dialogOpts = {
            buttons: {
                "Ok": execute,
                "Cancel": cancel
            }
        };
        $("#Dialog").dialog(dialogOpts);
    });

</script>

3 个答案:

答案 0 :(得分:1)

试试这个:http://jsfiddle.net/FgRqx/

<script type="text/javascript">

    $(function () {
        $('#dialog_link').click(function(e){
            e.preventDefault();

            $("#Dialog").dialog({
                buttons:    {
                    'OK': function(){
                        console.log('OK clicked!');
                    },
                    'Close': function(){
                        $(this).dialog('close');
                    }
                }
            });
        });
    });

</script>

答案 1 :(得分:0)

答案 2 :(得分:0)

工作演示 http://jsfiddle.net/BWXNe/

像这样的男人!希望它适合你的事业!

<强>脚本

  <script type='text/javascript' src='http://code.jquery.com/jquery-1.5.js'></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script>

      <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.0/themes/blitzer/jquery-ui.css">

<强>码

$(document).ready(function() {
    $('#dialog_link').click(function(){
                $( "#Dialog" ).dialog( "open" );    
    });

    $( "#Dialog" ).dialog({
            modal: true,
            autoOpen: false,
            height: 255,
            width: 300,
            buttons: {
                "Retrieve": function() {

                },
                Cancel: function() {
                    $( this ).dialog( "close" );
                }
            },
    });


});


​