弹出提示框 自动消失

最新推荐文章于 2023-06-27 15:48:24 发布
最新推荐文章于 2023-06-27 15:48:24 发布
阅读量934 收藏
点赞数
原文链接：http://www.cnblogs.com/zhengxiqiang/archive/2009/05/06/1451138.html
版权

 我们在进行增、删、改、查的时候，很多时候都需要一个提示信息以表明所做操作的成功等状况。有些人喜欢用alert()来提示，这不太人性化，因为alert()弹出来的提示框必须点确定才能继续进行其它操作。我所希望的做法是用一个div层来容纳这些友好提示信息，并能够自动消失

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>弹出提示框 自动消失</title>
<script language="javascript" type="text/javascript">
var speed=1000;
var wait=2;
var intTimeStep=20;
var isIe=(window.ActiveXObject)?true:false;
var intAlphaStep=(isIe)?5:0.05;
var curSObj=null;
var curOpacity=null;
function startObjVisible(objId)
{
   curSObj=document.getElementById(objId);
    if(wait==0)
    {
   setObjClose();
 }
    else
    {
      curSObj.style.display='';
      setObjOpen();
   wait--;  
      setTimeout("startObjVisible('objDiv')",speed);
    }
}

function setObjOpen()
{
  if(isIe)
  {
  curSObj.filters.alpha.opacity+=intAlphaStep;
     if (curSObj.filters.alpha.opacity<100)
   {
       setTimeout('setObjOpen()',intTimeStep);
   }
  }
  else
  { 
     curOpacity+=intAlphaStep;
     curSObj.style.opacity =curOpacity;
     if (curOpacity<1) setTimeout('setObjOpen()',intTimeStep);
  }
}

function setObjClose()
{
  if(isIe)
  {
      curSObj.filters.alpha.opacity-=intAlphaStep;
      if (curSObj.filters.alpha.opacity>0)
        {
         setTimeout('setObjClose()',intTimeStep);
        }
      else
     {
  curSObj.style.display="none";
  }
  }
  else
  {
       curOpacity-=intAlphaStep;
       if (curOpacity>0)
      {
            curSObj.style.opacity =curOpacity;
            setTimeout('setObjClose()',intTimeStep);
      }
       else
      {
        curSObj.style.display='none';
         }
   }
}
</script>
</head>
<body>
 <input type="button" onClick="startObjVisible('objDiv')" value="添加数据" />
<div id="objDiv" style="display:none; z-index:999; left:100px; filter:alpha(opacity=0);position:absolute; background-color:#FFCC66; height:100px; width:200px;">添加成功 </div>
</body>
</html>

 

转载于:https://www.cnblogs.com/zhengxiqiang/archive/2009/05/06/1451138.html

weixin_34319817
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
自动关闭的弹出框(alert)
阿牛博客
08-16 8562
New Document     function autoCloseAlert(msg)   {      var tempFrm=document.getElementById("msgFrm");   if(tempFrm==null||typeof(tempFrm)=="undefined")   {     tempFrm =document.createElement("ifra
qt弹出框自动消失的悬浮提示框_Qt气泡提示框（自动消失）
weixin_31408789的博客
01-17 1197
#ifndef FUNCTION_MESSAGE_WIDGET_H#define FUNCTION_MESSAGE_WIDGET_H#include QT_BEGIN_NAMESPACEclass QPaintEvent;QT_END_NAMESPACEclass FunctionMessageWidget : public QWidget{Q_OBJECTpublic:explicit Func...
js提示框替代系统alert,自动关闭alert对话框的实现方法
01-19
自己写了个alert提示框。因为系统alert在苹果手机微信中，提示时，顶部会显示网站地址。 同时其他后续操作需要在js中继续填写。因此简单用div写了一个alert提示框，并自动关闭。 效果图 css样式 /*弹出消息对话框样式*/ .show_alert_box{ width:100%; height:100%; position:fixed; top:0px; left:0px; background-color:rgba(0,0,0,0.6); display:none; z-index:200; } .show_alert_div{ width:70%; position:ab
alert 延迟自动关闭
qq_43717742的博客
01-09 1626
alert 延迟自动关闭
可自动关闭的alert()方法
热门推荐
kopala的博客
09-09 2万+
 html>  head>  title>JavaScript自动关闭窗口title>  meta http-equiv="content-Type" content="text/html;charset=gb2312">  head>  body>     input type="button" value="弹出alert框自动关闭" onClick="Alert('不点击确定三秒后
juery实现alert弹框2s自动关闭
Camellia919的博客
12-08 2876
消息提示信息在使用$.massager.alert("提示","保存成功！")后每次都需要点击【确定】按钮才能关闭弹框，客户体验度不太好，于是想到setTimeout方法去延时关闭这个窗口。如下：直接copy就可以使用setTimeout(function(){ $(".messager-body").window('close'); },1000); alert()弹框貌似无法直接关闭
自定义弹出提示框
hqkhly的博客
03-31 618
把confirm提示框的 “确定”和“取消”按钮，修改一下文字，并进行相应的按钮事件。 (function () { $.MsgBox = { Confirm: function (title, msg, callback) { GenerateHtml("confirm", title, msg); btnOk(callbac
wpf两种方式自动消失的提示框
10-21
本篇文章将详细讲解如何使用两种方法在C#中实现这种自动消失的提示框：MessageBox和自定义Window。 首先，我们来看第一种方法：使用MessageBox。MessageBox是.NET Framework提供的内置对话框，通常用于显示简单的...
labview 提示对话框自动消失和按照规定的倒计时提示款自动消失
11-10
总之，通过自定义LabVIEW的对话框并结合计时器和事件结构，我们可以创建出具备倒计时自动消失功能的提示对话框。这种方法不仅可以提高用户体验，还能为自动化流程提供更灵活的信息传递方式。在实际应用中，记得根据...
html5点击弹出自动关闭消息提示框
11-24
通过设置一个时间延迟，消息框在一定时间后自动消失。 5. **DOM操作**：使用JavaScript操作DOM，例如添加、删除或修改DOM元素，是实现这个功能的必要步骤。通过`document.getElementById`、`document.createElement...
C#消息提示框，不需用户点确定，提醒后自动消失
02-09
本主题将深入探讨如何创建一个自定义的C#消息提示框，它可以在显示信息后自动消失，同时带有动画效果以确保用户注意到。 首先，我们需要创建一个自定义的用户控件（User Control），这将是我们的自定义消息提示框。...
bootstrap提示框定时消失
03-29
在 Bootstrap 中，提示框（Tooltips）和弹出框（Popovers）是两个内置的组件，它们能够显示额外的信息，但它们默认并不具备定时消失的功能。 为了实现提示框定时消失，我们需要借助于 JavaScript 或 jQuery。jQuery...
可自动关闭的alert方法
jacke121的专栏
11-29 4800
https://www.cnblogs.com/liushiyong1/p/3549081.html   可自动关闭的alert()方法 layer.msg &lt;html&gt;   &lt;head&gt;   &lt;title&gt;JavaScript自动关闭窗口&lt;/title&gt;   &lt;meta http-equiv="content-Type" con...
html5中如何使弹出的窗口自动关闭,JS弹出div和关闭
weixin_42373066的博客
05-31 1081
//--弹出divvar parameter;var type;function alert_div(type,parameter){//获得鼠标当前X,Y坐标var x,y;if(!document.all){x=pageX;y=pageY;}else{x=document.body.scrollLeft+event.clientX; //鼠标X轴的值y=document.body.scroll...
JavaScript特效——弹窗3秒后消失
qq_43852612的博客
06-27 2004
运用JavaScript中的jQuery库实现一些小特效
Alert弹出框自动关闭
xiaowangzi1988的专栏
04-14 1万+
<br /><html>   <br /><head>   <br /><title>自动关闭alert框-模拟成非模态形式</title>   <br /></head>   <br /><body>   <br /><input type="button" value="弹出alert框自动关闭" onClick="myAlert('不点击确定三秒后自动关闭')">   <br /></body>   <br /><script type="text/javascript"><br /> functio
开发教程文档.docx
最新发布
08-14
1. Java简介 Java是一门由Sun Microsystems公司于1995年推出的高级编程语言。它具有跨平台的特性，能够在多种操作系统（如Windows、Mac OS和各种Unix版本）上运行。Java的最大特点是“一次编写，到处运行”，这得益于Java虚拟机（JVM）的存在。 2. 环境搭建 在开始Java编程之前，需要先搭建开发环境。你需要安装Java开发工具包（JDK）和一个集成开发环境（IDE），比如IntelliJ IDEA或Eclipse。JDK是Java开发的核心，包括了编译器和标准类库，而IDE则为你提供了一个方便的开发界面。 3. 基本语法 学习Java的第一步是掌握它的基本语法。你需要了解如何定义变量、使用基本数据类型、控制程序流程（如条件语句和循环语句）以及如何定义和使用函数。这些基础知识是编写任何Java程序的基础。 java public class HelloWorld { public static void main(String[] args) { System.out.println("Hello, World!
JS实现弹出框提示5秒后弹出框消失
05-13
2. 使用setTimeout函数设置一个定时器，让弹出框在5秒后消失。 3. 当定时器时间到达时，移除弹出框。 下面是示例代码： HTML部分： ``` <span class="close">× 这是一个弹出框提示！ ``` CSS部分...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值