返回
首页
业界
电商
创业
访谈
手机
移动
报告
运营
建站
互联网+
系统
教程
搜索

Jquery中dialog属性小记

2020-05-22 21:59:03易采站长站整理


$(‘#dialogDiv’).dialog(
{
hide:true, //点击关闭是隐藏,如果不加这项,关闭弹窗后再点就会出错.
autoOpen:false,
height:380,
width:800,
modal:true, //蒙层（弹出会影响页面大小）
title:’开标人’,
overlay: {opacity: 0.5, background: “black” ,overflow:’auto’},
buttons:{
‘确定’:function(){
// 处理方法 addUser();
},
‘取消’:function(){
//关闭当前Dialog
$(this).dialog(“close”);
}
}
}
);
$(‘#addItems’).click(function(){
loadPage(‘buildOpeningGroupAddOpering.htm’,’#dialogDiv’); //dialog记取页面
//$(window.parent.document).find(“#projectSpaceContent .show”).height(600)//调整当前Iframe高度
$(‘#dialogDiv’).data(‘title.dialog’, ‘新增开标人’).dialog(‘open’); //修改标题
return false;
})
function loadPage(path,id) {
$.get(path, function(data) {
// data = data.replace(/<script.*>.*</script>/ig,””); //移除script 标签
data = data.replace(/</?link.*>/ig,””); //移除 link 标签
data = data.replace(/</?html.*>/ig,””); //移除 html 标签
data = data.replace(/</?body.*>/ig,””); //移除 body 标签
data = data.replace(/</?head.*>/ig,””); //移除 head 标签
data = data.replace(/</?!doctype.*>/ig,””); //移除 doctype 标签
data = data.replace(/<title.*>.*</title>/ig,””); //移除 title 标签
$(id).empty().html(data);//清空contentMain内容并加载html
});
}
//为弹出层增加关闭按钮
$(‘.ui-dialog-buttonpane’).show().empty();
$(‘<button>关闭</button>’).click(function(){
$(“#dialogDiv”).dialog(‘close’);
return false;
}).appendTo(‘.ui-dialog-buttonpane’);

还是先看例子吧。另外如果要拖动、改变dialog的大小的话要加上ui.draggble.js和ui.resizable.js

<!DOCTYPE html>
<html>
<head>
<link type=”text/css” href=”http://jqueryui.com/latest/themes/base/ui.all.css” rel=”stylesheet” />
<script type=”text/javascript” src=”http://jqueryui.com/latest/jquery-1.3.2.js”></script>
<script type=”text/javascript” src=”http://jqueryui.com/latest/ui/ui.core.js”></script>
<script type=”text/javascript” src=”http://jqueryui.com/latest/ui/ui.dialog.js”></script>
<script>
$(“#dialog”).dialog({autoOpen:false,buttons:{“确定”:function(){$(this).dialog(“close”);}},closeOnEscape:true,hide:”slide”,modal:true,title:”对话 框”}).dialog(“open”);

相关文章 大家在看