jQuery 如何强制 Kendo UI 模态窗口在页面中居中？以及如何禁用所有操作？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16367978/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to force a Kendo UI modal window to center in a page? and how to disable all the actions?
提问by Uriel Arvizu
I'm trying to display a Kendo UI modal window in the center of the browser, but it keeps showing up at the bottom of the page, by this I mean the only visible part of the window is the top bar, the rest of the window is out of sight, only when you drag it around you can view it properly. I have no styles applied to the div that is being used for the window so I'm confused as to why it's being shown like that.
我试图在浏览器的中央显示一个 Kendo UI 模式窗口，但它一直显示在页面底部，我的意思是窗口唯一可见的部分是顶部栏，其余部分窗口是看不见的，只有左右拖动才能正常查看。我没有应用到用于窗口的 div 的样式，所以我很困惑为什么它会这样显示。
Also I want to disable all of the action button on the top bar of the window, tried to set an empty action array but a close button is being shown as default, is there a way to just show the title of the window on the top bar? I want the window to disappear when a button in it is clicked.
另外我想禁用窗口顶部栏上的所有操作按钮，尝试设置一个空的操作数组，但默认显示关闭按钮，有没有办法只在顶部显示窗口的标题酒吧？我希望窗口在单击其中的按钮时消失。
This is how I'm creating the window:
这是我创建窗口的方式：
var accessWindow = $("#accessDiv").kendoWindow({
actions: [],
draggable: true,
height: "300px",
modal: true,
resizable: false,
title: "Access",
width: "500px"
});
accessWindow.center();
accessWindow.open();
This is my div with only a label, an input and a button, no CSS is being applied to it at the moment:
这是我的 div，只有一个标签、一个输入和一个按钮，目前没有应用 CSS：
<div id="accessDiv" style=" width: 100%; height: 100%; background-color: #fff;">
<label>Enter access key</label>
<input type="text" />
<input type="button" title="Enter" value="Enter" />
</div>
回答by plinkplink
Have you tried hiding it, then centering and opening it?
你有没有试过隐藏它，然后居中并打开它？
var accessWindow = $("#accessDiv").kendoWindow({
actions: {}, /*from Vlad's answer*/
draggable: true,
height: "300px",
modal: true,
resizable: false,
title: "Access",
width: "500px",
visible: false /*don't show it yet*/
}).data("kendoWindow").center().open();
from: http://www.kendoui.com/forums/ui/window/kendowindow-center-doesn-t-work-when-inside-an-iframe.aspx
来自：http: //www.kendoui.com/forums/ui/window/kendowindow-center-doesn-t-work-when-inside-an-iframe.aspx
回答by jfl
The last two lines should read:
最后两行应为：
accessWindow.data("kendoWindow").center();
accessWindow.data("kendoWindow").open();
回答by Vlad Omelyanchuk
1.You need to swap last two lines of code. First of all you need to open window and then you can center it.
1.你需要交换最后两行代码。首先，您需要打开窗口，然后才能将其居中。
2.To show window without any actions you need to pass empty object:
2.要显示没有任何操作的窗口，您需要传递空对象：
actions: {}
回答by sethu madhav
The below one works for me. If you don't like it as a modal, set it to false or remove it.
下面一个对我有用。如果您不喜欢它作为模态，请将其设置为 false 或将其删除。
var window = $("#addBlacklistWind");
$("#btnAddBlacklist").bind("click", function () {
window.data("kendoWindow").center().open();
});
window.kendoWindow({
width: "800px",
title: "Add New Blacklist",
modal: true,
visible: false,
actions: [
"Maximize",
"Close"
]
});
