最近找到一个用于web前端的对话框,能替换掉浏览器的alert,confirm,和prompt.
效果如下:
主要用到一个js文件 dialog.js
使用方法有三种
1. 设定内容为url
var addPop = new Popup({contentType:1,isReloadOnClose:false,width:450,height:300});
addPop.color = {cColor:"#EEEEEE", bColor:"#FFFFFF", tColor:"#709CD2", wColor:"#FFFFFF"};
addPop.setContent("contentUrl","album/addAlbum.jsp");
addPop.setContent("title","创建新的相册");
addPop.build();
addPop.show();
//contentTye为对话框的种类,为1时对话框建在了iframe中,
album/addAlbum.jsp代码
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'addAlbum.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>
<body>
相册名称:<input type="text"><br>
<input type="button" value="添加">
</body>
</html>
效果
2。直接设定内容
var noticePop = new Popup({contentType:2,isReloadOnClose:false,width:400,height:100});
noticePop.color = {cColor:"#EEEEEE", bColor:"#FFFFFF", tColor:"#709CD2", wColor:"#FFFFFF"};
noticePop.setContent("title","提示");
noticePop.setContent("contentHtml","<div style='margin:15px;'>目前您的相册中还没有照片,快来体验超大容量、快速上传的百度空间相册服务吧。立即上传喜欢的图片,展示丰富多彩的生活。<br><br><input type=\"button\" value='上传相片'></div>");
noticePop.build();
noticePop.show();
可以结合ajax一起使用
3. 相当于window.confirm()
function deleteCategory(id){
pop=new Popup({ contentType:3,isReloadOnClose:false,width:395,height:80});
pop.setContent("title","删除分类");
pop.setContent("confirmCon","您确定要删除?删除后该分类下的文章将移至默认分类下");
pop.setContent("callBack",delCallback_pop);
pop.setContent("parameter",{fid:"deletecatform",index:id,popup:pop});
pop.setContent("overlay",1);
pop.build();
pop.show();
}
function delCallback_pop(para){
pop.close(); //关闭对话框
var index = para["index"];取得参数
}
- 大小: 14.7 KB
- 大小: 12 KB
分享到:
相关推荐
js弹出圆角对话框,带关闭按钮。视觉效果很好,包括五种不同的展示风格
弹窗代码经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。...
使用JS打开图片另存为对话框一直都是网页应用中不可缺少的一部分,本人有些好奇,于是搜集整理了一些实现代码,不知道符不符合大众的口味,在此班门弄斧了,需要的朋友可以了解下
仿163信箱js模拟对话框代码,非常漂亮,调用简单!
js确认删除对话框效果的示例代码.docx
js对话框传递参数 开发代码例子 1.要想对话框传递参数 2.可以通过window.returnValue向打开对话框的窗口返回信息,当然也可以是对象
jQuery弹出层对话框代码基于jquery-3.3.1.min.js制作,有基础对话框、全屏对话框、可拖动对话框、暗黑模式对话框、设置宽度、隐藏按钮、设置按钮文字、按钮事件、自动关闭、嵌套iframe、内容背景色、隐藏遮罩层等...
最近闲来无事,用js自己做了一个弹出式对话框,需要应用弹出式对话框的朋友可以参考下。
js+css3软件卸载对话框代码.zip
JS确认删除对话框代码,可用于删除、编辑等操作确认效果。代码说明:单击删除的超链接后将执行delcfm()函数,在对话框中,如果点击“确定”,函数将返回true值,就将页面转到标签中的链接页面执行删除的页面;如果...
PopupWindow之显示顶层对话框代码
这是一款通过CSS+JS代码来实现的网页确认框和对话框特效。
jQuery手机移动端模态网页对话框插件是一款支持三种类型的弹出对话框,支持自定义按钮,文字等,并支持事件监听,这个特别适合手机网站使用。
HTML5手机端简单弹出对话框代码,触屏操作,多种弹出对话框效果!
JavaScript仿百度弹出窗口对话框效果
jQuery点击删除弹出对话框代码是一款鼠标点击弹出是否删除行代码。
介绍了javascript中模式对话框的用法 (showModalDialog)
content:弹出框的主题内容,可以是html代码; flag:弹出框的类型标识,0-5,分别对应警告框,确定取消框,警告&强制执行框,确定取消框2型,自定义弹出框; fun:弹出框的确定点击事件,字符串型(如"ok()"); fun2...