5

我在 MVC 剃须刀视图中有一个 jquery 对话框，里面有一个关闭按钮。但是在单击关闭按钮时，对话框只是被隐藏并没有被删除，因此当单击页面上的任何链接时它不起作用，这是不希望的；不，我每次关闭对话框时都想重定向到我的操作方法。

单击对话框标题上的“X”按钮时，我得到了我想要的。所以我的学长现在希望我完全删除“关闭”按钮并在标题中写“关闭”而不是“X”。我设法通过我的 chrome 浏览器控制台编辑我的对话框，删除了对话框标题使用的大量 CSS 类。但我不知道在哪里更改我的项目中的代码（CSS或jquery）以实现这一点！请赐教对话框！

这是我的对话框：

$(function () {

        $.ajaxSetup({ cache: false });
        $(".ExportStatus").live("click", function (e) {

            e.preventDefault();
            var height = 350, width = 370;  //height = 350 width = 345; 
            $('<div><span class="well"  style="position: absolute; top: 85px; left: 70px"><img src="' + loaderimagePath + '" alt="Processing your request. Please wait..." /></span></div>')
            .addClass("dialog")
            .attr("id", $(this).attr("data-dialog-id"))
            .appendTo("body")
            .dialog({
                //                    open: function () {
                //                        $(".ui-dialog-titlebar-close").val() = closebutton;
                //                    },
                title: $(this).attr("data-dialog-title"),
                closeOnEscape: true,
                resizable: false,
                //                    close: $(this).attr("data-dialog-titlebar-close"),         
                //                      $("data-dialog-title-close").live("click", 
                //                    function () {
                //                        $(".ui-dialog").hide();
                //                        $(".ui-widget-overlay").hide();
                //                    },                       
                //window.setTimeout('location.reload()', 0);   $(this).remove()
                buttons: {
                    "Close": function () {
                        e.preventDefault();
                        $(".ui-dialog").remove();
                        $(".ui-widget-overlay").remove();
                        // $(" #quickfillDialog").dialog("hide");

                        return false;
                    }


                },![enter image description here][1]
                modal: true,
                position: 'middle',
                width: width,
                height: height
            })

            // $(".ui-dialog-titlebar-close").click( function() {
            // $(this).parent().children().children("a.ui-dialog-titlebar-close").remove();
            .load(this.href, function (response, status, xhr) {
                if (status == "error") {
                    var msg = "Sorry but there was an error: ";
                    $('.dialog').html(msg + xhr.status + "<br/>" + xhr.statusText + "<br/>" + xhr.responseText);
                }
            });
        });
4

2 回答 2

5

您可以将上述 jQuery 代码的对话框部分修改为：

.dialog({
    open: function(event, ui) {
        $('.ui-dialog-titlebar-close')
            .removeClass("ui-dialog-titlebar-close")
            .html('<span style="float:right;">Close</span>');
    }
})

希望这可以帮助！

于 2012-11-19T14:38:31.697 回答
0

这有效。

创建自定义 CSS。

.ui-dialogpopupclose {
      visibility: hidden;
}

使用下面的代码在对话框中添加/删除。

open: function (event, ui) {
                $(".ui-dialog-titlebar-close").addClass('ui-dialogpopupclose');
},
close: function (event, ui) {
                $(".ui-dialog-titlebar-close").removeClass('ui-dialogpopupclose');
}
于 2020-07-17T14:48:12.520 回答