如何将网页中弹出的小网页在点击相应按钮之后消失?

luo6620378xu 2011-05-27 09:57:38
可能标题没有表达明白意思。
举个例子来说:
百度知道的首页
http://zhidao.baidu.com/
当我点击“登录”链接的时候,会弹出一个小网页。
当用户输入相应信息,单击登录按钮之后,该弹出
网页消失了。

我想实现一个类似的功能。

界面上有一个确定按钮和取消按钮。
当用户点击确定的时候,获取界面中的信息
之后使该弹出小网页消失。
当用户点击取消按钮的时候,仅仅使该弹出小网页消失。


请问应该如何实现?
能够给出代码吗?
谢谢!
...全文
245 4 打赏 收藏 转发到动态 举报
写回复
用AI写文章
4 条回复
切换为时间正序
请发表友善的回复…
发表回复
luo6620378xu 2011-05-27
  • 打赏
  • 举报
回复
自己搞定了,结贴!
luo6620378xu 2011-05-27
  • 打赏
  • 举报
回复
现在的代码是这个样子的:
tipswindown.js//该js文件完成弹出框的弹出,是我从网上下载的。
///-------------------------------------------------------------------------
//jQuery弹出窗口 By Await [2009-11-22]
//--------------------------------------------------------------------------
/*参数:[可选参数在调用时可写可不写,其他为必写]
----------------------------------------------------------------------------
title: 窗口标题
content: 内容(可选内容为){ text | id | img | url | iframe }
width: 内容宽度
height: 内容高度
drag: 是否可以拖动(ture为是,false为否)
time: 自动关闭等待的时间,为空是则不自动关闭
showbg: [可选参数]设置是否显示遮罩层(0为不显示,1为显示)
cssName: [可选参数]附加class名称
------------------------------------------------------------------------*/
//示例:
//------------------------------------------------------------------------
//simpleWindown("例子","text:例子","500","400","true","3000","0","exa")
//------------------------------------------------------------------------
var showWindown = true;
var templateSrc = "http://leotheme.cn/wp-content/themes/Dreamy"; //设置loading.gif路径
function tipsWindown(title,content,width,height,drag,time,showbg,cssName) {
$("#windown-box").remove(); //请除内容
var width = width>= 950?this.width=950:this.width=width; //设置最大窗口宽度
var height = height>= 527?this.height=527:this.height=height; //设置最大窗口高度
if(showWindown == true) {
var simpleWindown_html = new String;
simpleWindown_html = "<div id=\"windownbg\" style=\"height:"+$(document).height()+"px;filter:alpha(opacity=0);opacity:0;z-index: 999901\"></div>";
simpleWindown_html += "<div id=\"windown-box\">";
simpleWindown_html += "<div id=\"windown-title\"><h2></h2><span id=\"windown-close\">关闭</span></div>";
simpleWindown_html += "<div id=\"windown-content-border\"><div id=\"windown-content\"></div></div>";
simpleWindown_html += "</div>";
$("body").append(simpleWindown_html);
show = false;
}
contentType = content.substring(0,content.indexOf(":"));
content = content.substring(content.indexOf(":")+1,content.length);
switch(contentType) {
case "text":
$("#windown-content").html(content);
break;
case "id":
$("#windown-content").html($("#"+content+"").html());
break;
case "img":
$("#windown-content").ajaxStart(function() {
$(this).html("<img src='"+templateSrc+"/images/loading.gif' class='loading' />");
});
$.ajax({
error:function(){
$("#windown-content").html("<p class='windown-error'>加载数据出错...</p>");
},
success:function(html){
$("#windown-content").html("<img src="+content+" alt='' />");
}
});
luo6620378xu 2011-05-27
  • 打赏
  • 举报
回复
[Quote=引用 1 楼 showbo 的回复:]
一个浮动层而已。。

JQ制作的几个还不错的弹出层
[/Quote]

那个浮动层,我已经生成了。弹出框我已经实现了。

现在是想要处理一下按钮的问题。

---------------=========
我想实现一个类似的功能。

界面上有一个确定按钮和取消按钮。
当用户点击确定的时候,获取界面中的信息
之后使该弹出小网页消失。
当用户点击取消按钮的时候,仅仅使该弹出小网页消失。


  • 打赏
  • 举报
回复
一个浮动层而已。。

JQ制作的几个还不错的弹出层

87,989

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧