artdialog(artdialog官网)

更新时间:2023-03-01 10:14:21 阅读: 评论:0

artdialog 弹出对话框怎么关闭自己

  artDialog是一个基于javascript编写的对话框组件,它拥有精致的界面与友好的接口。
  如果你想在弹出的对话框里,加一个自己的按钮,来关闭自己,普通对话框可以使用以下方式:
  //artdialog弹出对话框之后会返回一个dialog句柄
  var
dialog
=
art.dialog(content,
ok,
cancel)
  
  //你可以在对话框事件中通过该句柄的clo方法,将对话框自己关闭。
  function
cloSelf(){
  dialog.clo();
  }
  
  如果是弹出一个iframe对话框呢?获得的对话框句柄在是父窗体里的,需要在子窗体里使用该句柄把自己关掉。
  artdialog提供了框架之间的数据传递方式,你要包含artDialog.iframeTools.js方法。
  var
temp
=
{};
  art.dialog.data('temp',
temp);
  temp.dialog
=
art.dialog('../childframe.html');
  
  这样你的数据就穿越了。在childframe.html的js里,你可以使用下面的方式获取自己的窗口句柄,然后关闭自己。

求助artdialog art.dialog.open方法无法打开页面的问题

求助artdialog art.dialog.open方法无法打开页面的问题
main(){
int a;
printf("input integer number: ");
scanf("%d",&a);
switch (a){
ca 1:printf("Monday\n");break;
ca 2:printf("Tuesday\n"); break;
ca 3:printf("Wednesday\n");break;
ca 4:printf("Thursday\n");break;
ca 5:printf("Friday\n");break;
ca 6:printf("Saturday\n");break;
ca 7:printf("Sunday\n");break;
default:printf("error\n");
}
}
在使用switch语句时还应注意以下几点:
1) 在ca后的各常量表达式的值不能相同,否则会出现错误。
2) 在ca后,允许有多个语句,可以不用{}括起来。
3) 各ca和default子句的先后顺序可以变动,而不会影响程序执行结果。
4) default子句可以省略不用。

怎么在artdialog弹出框右上角添加最大最小化按钮

通过分析关闭按钮的定义来实现其他按钮。关闭按钮是通过 html 模板定义的,定义同样在 artDialog.source.js 文件中,代码如下:

[javascript] view plain copy
artDialog._templates =
'<div class="aui_outer">'
+ '<table class="aui_border">'
+ '<tbody>'
+ '<tr>'
+ '<td class="aui_nw"></td>'
+ '<td class="aui_n"></td>'
+ '<td class="aui_ne"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_w"></td>'
+ '<td class="aui_c">'
+ '<div class="aui_inner">'
+ '<table class="aui_dialog">'
+ '<tbody>'
+ '<tr>'
+ '<td colspan="2" class="aui_header">'
+ '<div class="aui_titleBar">'
+ '<div class="aui_title"></div>'
+ '<a class="aui_clo" onclick="javascript:/*artDialog*/;">'//href paul mod
+ '\xd7'
+ '</a>'
+ '</div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_icon">'
+ '<div class="aui_iconBg"></div>'
+ '</td>'
+ '<td class="aui_main">'
+ '<div class="aui_content"></div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td colspan="2" class="aui_footer">'
+ '<div class="aui_buttons"></div>'
+ '</td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+ '</div>'
+ '</td>'
+ '<td class="aui_e"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_sw"></td>'
+ '<td class="aui_s"></td>'
+ '<td class="aui_"></td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+'</div>';

这里,我们发现 aui_clo 样式被定义为关闭按钮

于是,修改这里的代码,追加两个 div 变成下边的代码:

[javascript] view plain copy
artDialog._templates =
'<div class="aui_outer">'
+ '<table class="aui_border">'
+ '<tbody>'
+ '<tr>'
+ '<td class="aui_nw"></td>'
+ '<td class="aui_n"></td>'
+ '<td class="aui_ne"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_w"></td>'
+ '<td class="aui_c">'
+ '<div class="aui_inner">'
+ '<table class="aui_dialog">'
+ '<tbody>'
+ '<tr>'
+ '<td colspan="2" class="aui_header">'
+ '<div class="aui_titleBar">'
+ '<div class="aui_title"></div>'
+ '<div class="aui_min" state="fal"></div>'
+ '<div class="aui_max" state="fal"></div>'
+ '<a class="aui_clo" onclick="javascript:/*artDialog*/;">'//href paul mod
+ '\xd7'
+ '</a>'
+ '</div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_icon">'
+ '<div class="aui_iconBg"></div>'
+ '</td>'
+ '<td class="aui_main">'
+ '<div class="aui_content"></div>'
+ '</td>'
+ '</tr>'
+ '<tr>'
+ '<td colspan="2" class="aui_footer">'
+ '<div class="aui_buttons"></div>'
+ '</td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+ '</div>'
+ '</td>'
+ '<td class="aui_e"></td>'
+ '</tr>'
+ '<tr>'
+ '<td class="aui_sw"></td>'
+ '<td class="aui_s"></td>'
+ '<td class="aui_"></td>'
+ '</tr>'
+ '</tbody>'
+ '</table>'
+'</div>';

在这里,我追加了两个 div ,样式分别定义为 aui_max 和 aui_min,具体样式请自行到相应的样式文件中修改,比如定义按钮图片之类的,这里就不细说了

在定义完成后,弹出新的窗口时,这两个按钮已经出现了,现在,我们需要对我们定义的按钮进行事件追加了
首先,我们在 clo 方法附近追加一下代码,来作为最大化的方法实现

[javascript] view plain copy
max: function () {
var that = this,
DOM = that.DOM;
var border = jQuery(DOM.content[0]); // 获取 artDialog 窗口的 iframe 对象
var max = jQuery(DOM.max[0]); // 获取最大化按钮对象
if (max.attr('state') == 'fal') { // 判断是否已最大化
max.attr('_width', border.width()); // 记录当前窗口定义的宽度
max.attr('_height', border.height()); // 记录当前窗口定义的高度
max.attr('state', 'true'); // 修改最大化按钮状态为真
this.position(0, 0); // 将窗口移动到左上角
this.size('100%', '100%'); // 修改窗口大小
} el {
jQuery(DOM.border[0]).parent().parent().css('width', (max.attr('_width') * 1 + 30) + 'px'); // 修改窗口最外层 div 定义的宽度,这个 div 是窗口外层的样式窗口,比我们定义的窗口宽上 30 像素,根据使用的皮肤不同有所区别
this.size(max.attr('_width') + 'px', max.attr('_height') + 'px'); // 将窗口大小按照已记录的宽和高进行设置
this.position('50%', '50%'); // 将窗口居中
max.attr('state', 'fal'); // 设置最大化状态为假
max.removeAttr('_width'); // 删除已记录的宽
max.removeAttr('_height'); // 删除已记录的高
}
return that;
}

注意实际添加代码的时候,要在最后加个逗号哦,毕竟是写在 artDialog.fn 的定义对象里的内容

这里我实现的思路是这样的,首先在最大化、最小化按钮中设置一个属性 state,表示窗口是否已经最大化或最小化
然后在点击按钮的时候判断一下,如果没有则最大化,否则则还原
在事件实现方法定义完成后,我发现点击按钮并没有发生什么,所以,我们还需要将事件和方法进行关联起来,于是再次查阅代码,发现以下定义:

[javascript] view plain copy
// 同样在 artDialog.fn 定义中
// 事件代理
_addEvent: function () {
var resizeTimer,
that = this,
config = that.config,
isIE = 'CollectGarbage' in window,
DOM = that.DOM;

// 窗口调节事件
that._winResize = function () {
resizeTimer && clearTimeout(resizeTimer);
resizeTimer = tTimeout(function () {
that._ret(isIE);
}, 40);
};
_$window.bind('resize', that._winResize);

// 监听点击
DOM.wrap
.bind('click', function (event) {
var target = event.target, callbackID;

if (target.disabled) return fal; // IE BUG

if (target === DOM.clo[0]) {
that._click(config.cancelVal);
return fal;
} el {
callbackID = target[_expando + 'callback'];
callbackID && that._click(callbackID);
};

that._ie6SelectFix();
})
.bind('moudown', function () {
that.zIndex();
});
},

于是追加代码变成以下内容

[javascript] view plain copy
// 事件代理
_addEvent: function () {
var resizeTimer,
that = this,
config = that.config,
isIE = 'CollectGarbage' in window,
DOM = that.DOM;

// 窗口调节事件
that._winResize = function () {
resizeTimer && clearTimeout(resizeTimer);
resizeTimer = tTimeout(function () {
that._ret(isIE);
}, 40);
};
_$window.bind('resize', that._winResize);

// 监听点击
DOM.wrap
.bind('click', function (event) {
var target = event.target, callbackID;

if (target.disabled) return fal; // IE BUG

if (target === DOM.clo[0]) {
that._click(config.cancelVal);
return fal;
} el if (target === DOM.max[0]) {
that.max();
} el if (target === DOM.min[0]) {
that.min();
} el {
callbackID = target[_expando + 'callback'];
callbackID && that._click(callbackID);
};

that._ie6SelectFix();
})
.bind('moudown', function () {
that.zIndex();
});
},

于是发现事件被关联成功了,最后,由于不是所有窗口都需要最大化和最小化,所以在 artDialog.fn 定义中,修改 _init 定义的方法,追加以下内容

[javascript] view plain copy
config.min ? DOM.min.show() : DOM.min.hide();
config.max ? DOM.max.show() : DOM.max.hide();

修改 artDialog.defaults 定义的对象追加以下内容

[javascript] view plain copy
min: null,
max: null,

这样,窗口在打开时默认是没有最大化和最小化的,在我们需要弹出的定义中设置一下 max 、min 属性就可以显示并实现最大化、最小化了

[javascript] view plain copy
art.dialog.open(url,{
max : true,
min : true
},fal);

V6 artDialog取消了打开iframe 使用全屏的功能吗

​这样写可以全屏显示,新版就不确定了。
var d = Dialog({
title: '添加',
url:'/a.html',
width: '100%',
height: '100%',
//left: 0,
//top: 0,
//fixed: true,
//resize: fal,
//drag: fal,
padding: 0
});
d.show();

art.dialog需要引进哪几个js

首先你要获得这个组件,百度经验不让发链接,所以大家百度下获取
2
目录如下

END
二。导入项目
1
这里有两个导入方法,一种是不依赖任何组件和库
2
1.不依赖导入
<script type ="text/javascript" src="./Extend/artdialog/artDialog.js?skin=default"></script>
其中./Extend/artdialog/为存放目录
?skin=default,skin=皮肤,这里的皮肤指的是在skins目录下对应的.css文件

3
2.依赖jquery库
那么就应该先导入jquery库,后面导入<script type="text/javascript" src="./Extend/artdialog/jquery.artDialog.js?skin=default"></script>
注意是jquery.artDialog.js,不是artDialog.js,其他和上面提到一样。

END
三。使用
演示代码:
var dialog = art.dialog({
title: '欢迎',
content: '欢迎使用artDialog对话框组件!',
icon: 'succeed',
follow: document.getElementById('btn2'),
ok: function(){
return fal;
},okVal: '确定',
cancelVal: '关闭',
cancel: function(){
console.log(123);
},fixed:true,
resize:true
然后用一个函数封装这段代码,绑定触发事件即可.
详细介绍百度官网,百度不让发链接呀

本文发布于:2023-02-28 19:50:00,感谢您对本站的认可!

本文链接:https://www.wtabcd.cn/zhishi/a/167763686169452.html

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。

本文word下载地址:artdialog(artdialog官网).doc

本文 PDF 下载地址:artdialog(artdialog官网).pdf

下一篇:返回列表
标签:官网   artdialog
相关文章
留言与评论(共有 0 条评论)
   
验证码:
Copyright ©2019-2022 Comsenz Inc.Powered by © 实用文体写作网旗下知识大全大全栏目是一个全百科类宝库! 优秀范文|法律文书|专利查询|