弹窗(提示、确认)、弹页(悬浮编辑页,新页面)、悬框(指针)

本文介绍了前端开发中常见的几种交互设计:提示框使用了art.dialog.tips及$.messager.alert;确认框的实现,包括查看和修改功能;编辑页面弹出方式如top.showWin;新页面的打开方式,如利用<base target="_blank">和window.open;最后讨论了指针悬浮框的创建和控制,涉及onMouseOver和onMouseOut事件及display属性的使用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

一:提示框

1.art.dialog.tips("  ... ")

art.dialog.close()

http://blog.youkuaiyun.com/hougelou/article/details/8133648

 

2.与上面连用:限时自动提示:success函数中

setTimeout(function(){ alert("Hello"); }, 3000);

http://www.runoob.com/jsref/met-win-settimeout.html

 

3.$("#id").show(),$("#id").hide()过程等待框

需要有一个<div>,可用于Ajax前和success后

4.$.messager.alert('title',date.info)显示Ajax结果弹窗

二:确认框

art.dialog.confirm("确认删除?",function(){
 var url=parent.formateUrl("controller/...");
 $.ajax({
  url,type,dateType,
 success:function(data){
  if(...){
 art.dialog.tips("删除成功");
window.setTimeout(function(){
 art.dialog.close();
     $("#...").datagrid("relod");
},1500);
}
else{art.dialog.tips("无法删除")}
 },
   error:function(){art.dialog.tips("error");}
});
});

二:编辑页面弹出:查看和修改

1.top.showWin(url,options);

此页面只有取消键,用于查看键点击。

 

var url=parent.formateUrl("controller/...");

var options={

	w:843,

	h:600,

	title:"title",

	fn:'submitForm',

	id:"id"

}

top.showWin(url,options);

2.art.dialog.open(url,{})

 

三:打开页面

1.<base target="_blank" />

2.window.open(url,“_blank”,"...");

 

四:指针悬浮框

http://www.runoob.com/jsref/prop-style-display.html

http://blog.youkuaiyun.com/u012116457/article/details/46125627

1.onMouseOut和onMouseOver

2.Object.style.display="block"/"none"

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值