有没有可能打开一个jQuery UI对话框没有标题栏?
当前回答
我想出了一个动态删除标题栏的解决方案。
$("#example").dialog(dialogOpts);
// remove the title bar
$(".ui-dialog-titlebar").hide();
这将在对话框渲染后删除所有带有'ui-dialog-titlebar'类的元素。
其他回答
我认为最简洁的方法是创建一个新的myDialog小部件,由对话框小部件减去标题条形码组成。删除标题条形码看起来很简单。
https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.dialog.js
这对我隐藏对话框标题栏有用:
$(".ui-dialog-titlebar" ).css("display", "none" );
下一种形式解决了我的问题。
$('#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>
转到你的jquery-ui.js(在我的情况下是jquery-ui-1.10.3.custom.js)并搜索this._createTitlebar();并对其进行注释。
现在你的任何一个对话框都会显示标题。如果你想自定义标题,只需去_createTitlebar();并编辑其中的代码。
by
实际上还有另一种方法,直接使用对话框小部件:
您可以这样获得对话框小部件
$("#example").dialog(dialogOpts);
$dlgWidget = $('#example').dialog('widget');
然后做
$dlgWidget.find(".ui-dialog-titlebar").hide();
仅在该对话框中隐藏标题栏
并且在一行代码中(我喜欢链接):
$('#example').dialog('widget').find(".ui-dialog-titlebar").hide();
不需要在对话框中添加一个额外的类,直接就可以了。对我来说没问题。
推荐文章
- HTML5文本区域占位符不出现
- 我如何捕捉Ajax查询后错误?
- jQuery:什么是限制“数字”仅输入文本框的最佳方法?(允许使用小数点)
- 在window.setTimeout()发生之前取消/终止
- 检测当用户滚动到底部的div与jQuery
- 检测视口方向,如果方向是纵向显示警告消息通知用户的指示
- 禁用从HTML页面中拖动图像
- Jquery停止子事件触发父事件
- 使函数等待元素存在
- 我如何从一个URL获得片段标识符(哈希#后的值)?
- 将JS对象转换为表单数据
- 多模态叠加
- 如何从函数中禁用jQuery对话框中的按钮?
- 如何检查jQuery插件是否已加载?
- 与evt.preventDefault()相反的是什么?