有没有可能打开一个jQuery UI对话框没有标题栏?


当前回答

我认为最简洁的方法是创建一个新的myDialog小部件,由对话框小部件减去标题条形码组成。删除标题条形码看起来很简单。

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js

其他回答

当初始化对话框时,你可以使用jquery在使用dialogClass后隐藏标题栏。

init期间:

$('.selector').dialog({
    dialogClass: 'yourclassname'
});

$('.yourclassname div.ui-dialog-titlebar').hide();

通过使用这种方法,你不需要改变你的css文件,这也是动态的。

下一种形式解决了我的问题。

$('#btnShow').click(function() { $("#basicModal").dialog({ modal: true, height: 300, width: 400, create: function() { $(".ui-dialog").find(".ui-dialog-titlebar").css({ 'background-image': 'none', 'background-color': 'white', 'border': 'none' }); } }); }); #basicModal { display: none; } <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" /> <div id="basicModal"> Here your HTML content </div> <button id="btnShow">Show me!</button>

我认为最简洁的方法是创建一个新的myDialog小部件,由对话框小部件减去标题条形码组成。删除标题条形码看起来很简单。

https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js

转到你的jquery-ui.js(在我的情况下是jquery-ui-1.10.3.custom.js)并搜索this._createTitlebar();并对其进行注释。

现在你的任何一个对话框都会显示标题。如果你想自定义标题,只需去_createTitlebar();并编辑其中的代码。

by

我在我的项目中使用这个

$("#myDialog").dialog(dialogOpts);
// remove the title bar
$("#myDialog").siblings('div.ui-dialog-titlebar').remove();
// one liner
$("#myDialog").dialog(dialogOpts).siblings('.ui-dialog-titlebar').remove();