`
haihongxingzi
  • 浏览: 150777 次
  • 性别: Icon_minigender_1
  • 来自: 瑟孔达
社区版块
存档分类
最新评论

进入页面弹出窗口

阅读更多
  1、最基本的弹出窗口代码  
   
  其实代码非常简单:  
   
  〈SCRIPT   LANGUAGE="javascript"〉  
    〈!--  
    window.open   ("page.html")  
    --〉  
    〈/SCRIPT〉  
   
  因为这是一段Javascript代码,所以它们应该放在〈SCRIPT   LANGUAGE="javascript"〉之间。   〈!--   和   --〉是对一些版本低的浏览器起作用,在这些老浏览器中不会将标签中的代码作为文本显示出来。要养成这个好习惯啊。  
   
  window.open   ("page.html")   用于控制弹出新的窗口page.html,如果page.html不与主窗口在同一路径下,前面应写明路径,绝对路径(http://)和相对路径(../)均可。  
   
  用单引号和双引号都可以,只是不要混用。  
   
  这一段代码可以加入HTML的任意位置,〈head〉和〈/head〉之间可以,〈body〉间〈/body〉也可以,越前越早执行,尤其是页面代码长,又想使页面早点弹出就尽量往前放。   也可以,越前越早执行,尤其是页面代码长,又想使页面早点弹出就尽量往前放。  
   
  2、经过设置后的弹出窗口  
   
  下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。我们来定制这个弹出的窗口的外观,尺寸大小,弹出的位置以适应该页面的具体情况。  
   
  〈SCRIPT   LANGUAGE="javascript"〉  
    〈!--  
    window.open   ("page.html",   "newwindow",   "height=100,   width=400,   top=0,   left=0,   toolbar=no,   menubar=no,   scrollbars=no,   resizable=no,location=no,   status=no")  
    //写成一行  
    --〉  
    〈/SCRIPT〉  
    参数解释:    
    〈SCRIPT   LANGUAGE="javascript"〉js脚本开始;  
    window.open   弹出新窗口的命令;  
    "page.html"   弹出窗口的文件名;  
    "newwindow"   弹出窗口的名字(不是文件名),非必须,可用空"代替;  
    height=100   窗口高度;  
    width=400   窗口宽度;  
    top=0   窗口距离屏幕上方的象素值;  
    left=0   窗口距离屏幕左侧的象素值;  
    toolbar=no   是否显示工具栏,yes为显示;  
    menubar,scrollbars   表示菜单栏和滚动栏。  
    resizable=no   是否允许改变窗口大小,yes为允许;  
    location=no   是否显示地址栏,yes为允许;  
    status=no   是否显示状态栏内的信息(通常是文件已经打开),yes为允许;  
    〈/SCRIPT〉js脚本结束  
   
  3、用函数控制弹出窗口  
   
  下面是一个完整的代码:  
   
  〈html〉  
    〈head〉  
    〈script   LANGUAGE="JavaScript"〉  
    〈!--  
    function   openwin()   {  
    window.open   ("page.html",   "newwindow",   "height=100,   width=400,   toolbar=no,   menubar=no,   scrollbars=no,   resizable=no,   location=no,   status=no")  
    //写成一行  
    }  
    //--〉  
    〈/script〉  
    〈/head〉  
    〈body   onload="openwin()"〉  
    ...任意的页面内容...    
    〈/body〉  
    〈/html〉  
   
  这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。  
   
  怎么调用呢?  
   
  方法一:〈body   onload="openwin()"〉   浏览器读页面时弹出窗口;  
    方法二:〈body   onunload="openwin()"〉   浏览器离开页面时弹出窗口;  
    方法三:用一个连接调用:〈a   href="#"   onclick="openwin()"〉打开一个窗口〈/a〉  
    注意:使用的"#"是虚连接。  
    方法四:用一个按钮调用:〈input   type="button"   onclick="openwin()"   value="打开窗口"〉  
   
  4、同时弹出2个窗口  
   
  对源代码稍微改动一下:  
   
  〈script   LANGUAGE="JavaScript"〉  
    〈!--  
    function   openwin()   {  
    window.open   ("page.html",   "newwindow",   "height=100,   width=100,   top=0,   left=0,toolbar=no,   menubar=no,   scrollbars=no,   resizable=no,   location=no,   status=no")  
    //写成一行  
    window.open   ("page2.html",   "newwindow2",   "height=100,   width=100,   top=100,   left=100,toolbar=no,   menubar=no,   scrollbars=no,   resizable=no,   location=no,   status=no")  
    //写成一行  
    }  
    //--〉  
    〈/script〉  
   
  为避免弹出的2个窗口覆盖,用top和left控制一下弹出的位置不要相互覆盖即可。最后用上面说过的四种方法调用即可。  
   
  注意:2个窗口的name(newwindows和newwindow2)不要相同,或者干脆全部为空。OK?  
   
  5、主窗口打开文件1.htm,同时弹出小窗口page.html  
   
  如下代码加入主窗口区:  
   
  〈script   language="javascript"〉  
    〈!--  
    function   openwin()   {  
    window.open("page.html","","width=200,height=200")  
    }  
    //--〉  
    〈/script〉  
    加入〈body〉区:  
    〈a   href="1.htm"   onclick="openwin()"〉open〈/a〉即可  
   
  〈b>6、弹出的窗口之定时关闭控制  
   
  下面我们再对弹出的窗口进行一些控制,效果就更好了。如果我们再将一小段代码加入弹出的页面(注意是加入到page.html的HTML中,可不是主页面中,否则...),让它10秒后自动关闭是不是更酷了?  
   
  首先,将如下代码加入page.html文件的〈head〉区:  
   
  〈script   language="JavaScript">  
    function   closeit()   {  
    setTimeout("self.close()",10000)   //毫秒  
    }  
    〈/script〉  
   
  然后,再用〈body   onload="closeit()"〉这一句话代替page.html中原有的〈BODY〉这一句就可以了。(这一句话千万不要忘记写啊!这一句的作用是调用关闭窗口的代码,10秒钟后就自行关闭该窗口。)  
   
  7、在弹出窗口中加上一个关闭按钮  
   
  〈FORM〉  
    〈INPUT   TYPE="BUTTON"   VALUE="关闭"   onClick="window.close()"〉  
    〈/FORM〉  
   
  呵呵,现在更加完美了!  
   
  8、内包含的弹出窗口---一个页面两个窗口  
   
  上面的例子都包含两个窗口,一个是主窗口,另一个是弹出的小窗口。通过下面的例子,你可以在一个页面内完成上面的效果。  
   
  〈html〉  
    〈head〉  
    〈SCRIPT   LANGUAGE="JavaScript"〉  
    function   openwin()  
    {  
    OpenWindow=window.open("",   "newwin",   "height=250,     width=250,toolbar=no,scrollbars="+scroll+",menubar=no");  
    //写成一行  
    OpenWindow.document.write("〈TITLE〉例子〈/TITLE〉")  
    OpenWindow.document.write("〈BODY   BGCOLOR=#ffffff〉")  
    OpenWindow.document.write("〈h1〉Hello!〈/h1〉")  
    OpenWindow.document.write("New   window   opened!")  
    OpenWindow.document.write("〈/BODY〉")  
    OpenWindow.document.write("〈/HTML〉")  
    OpenWindow.document.close()  
    }  
    〈/SCRIPT〉  
    〈/head〉  
    〈body〉  
    〈a   href="#"   onclick="openwin()"〉打开一个窗口〈/a〉  
    〈input   type="button"   onclick="openwin()"   value="打开窗口"〉  
    〈/body〉  
    〈/html〉  
   
  看看OpenWindow.document.write()里面的代码不就是标准的HTML吗?只要按照格式写更多的行即可。千万注意多一个标签或少一个标签就会出现错误。记得用OpenWindow.document.close()结束啊。  
   
  9、终极应用--弹出的窗口之Cookie控制  
   
  回想一下,上面的弹出窗口虽然酷,但是有一点小毛病(沉浸在喜悦之中,一定没有发现吧?)比如你将上面的脚本放在一个需要频繁经过的页面里(例如首页),那么每次刷新这个页面,窗口都会弹出一次,是不是非常烦人?:-(    
   
  有解决的办法吗?当然有!我们使用cookie来控制一下就可以了。首先,将如下代码加入主页面HTML的〈HEAD〉区:  
   
  〈script〉  
    function   openwin(){  
    window.open("page.html","","width=200,height=200")  
    }  
    function   get_cookie(Name)   {  
    var   search   =   Name   +   "="   var   returnvalue   =   "";  
    if   (document.cookie.length   >   0)   {  
    offset   =   document.cookie.indexOf(search)  
    if   (offset   !=   -1)   {  
    offset   +=   search.length  
    end   =   document.cookie.indexOf(";",   offset);  
    if   (end   ==   -1)  
    end   =   document.cookie.length;  
    returnvalue=unescape(document.cookie.substring(offset,   end))  
    }  
    }  
    return   returnvalue;  
    }  
    function   loadpopup(){  
    if   (get_cookie("popped")=="){  
    openwin()  
    document.cookie="popped=yes"  
    }  
    }  
    〈/script〉  
   
  然后,用〈body   onload="loadpopup()"〉(注意不是openwin而是loadpop啊!)替换主页面中原有的〈BODY〉这一句即可
分享到:
评论

相关推荐

    aspx 页面弹出窗口代码大全

    替换主页面中原有的这一句即可。你可以试着刷新一下这个页面或重新进入该页面,窗口再也不会弹出了。

    javascript 控制弹出窗口

    前言:经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会... 【1、最基本的弹出窗口代码】 [removed] <!– window.open (‘page.html’) 

    自动弹出对话框代码 网页设计特效 美工助手

    弹窗代码经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项、版权信息、警告、欢迎光顾之类的话或者作者想要特别提示的信息。...

    PopupUnderline:使用弹出窗口来设置用户是否需要下划线以及在哪里

    弹出式下划线William DeckerCMP237FancyCellsHow to run: (node app.js) in terminal go to webpage localhost:8001 click either yes or no and follow onscreen instructions使用弹出窗口来设置用户是否需要下划线...

    Emlog蓝叶红包弹广告窗口插件.rar

    双11快要到了,淘宝又可以抢红包了,为了方便每天领取红包,于是作者“蓝叶”做了这个Emlog蓝叶红包插件,安装...Emlog蓝叶红包插件展示样式有两种,一种是居中弹出大图,一种是在右上角显示小图,根据个人喜好设置吧。

    jQuery网页延迟弹窗复制文本代码

    jQuery手机移动端网页延迟弹窗复制文本代码,页面延迟加载弹出窗口,点击勾选可以实现复制微信号的功能,未点击勾选而直接点击进入微信,这时页面会自动关闭弹窗。

    55种网页小技巧 ---- 下载无需扣分,具有一定收藏价值

    javascript主页弹出窗口技巧.html div span layer的区别.html email地址的分割.html ENTER键可以让光标移到下一个输入框.html IE地址栏前换成自己的图标 .html TEXTAREA自适应文字行数的多少.html title显示...

    都来订网络外卖订餐管理小秘书 V1.1.rar

    软件运行需要安装Microsoft .NET Framework 2.0以上版本 使用教程: ...5.窗口的右下角弹出窗口提示(都来订小秘书提醒),点击“查看订单”可以直接进入订单管理页面,可直接对订单进行处理。

    We7 CMS安装步骤

    2.右键属性弹出窗口 3.主目录如图: 4.配置 5.应用程序配置::将可执行文件的地址 (一般为C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll)复制 双击弹出窗口: 确定 插入: ...

    JavaScript网页设计300例

    带有300个详细的网页设计的例子,比如打开窗口居左,弹出窗口自动关闭,进入时显示时间,上次登录时间,设置默认主页,页面贼如..等等等等比较不错的JS特效.

    QT 实现登陆页面跳转到主页面源码

    实现登陆页面跳转到主页面源码

    N15_制造业进销存.zip

    解决方法3:IE浏览internet选项中,隐私中,弹出窗口阻止程序中,设置,例外,输入允许弹出窗口的地址。 7、在代码路径中\Client\js\input\jquery.selectInput.js中属性ajaxPath请修改成实际的虚拟目录名称, ...

    华华窗口拦截器 v1.0

    本软件的主要功能就是拦截右下角广告和各种软件弹出的迷你页面广告... 使用方法:点击【添加关键字】,然后出现下面的窗口!在窗口标题的右边,有一个图标,点击,然后挪动到需要禁止的右下角广告即可!然后,选择...

    LQ1600K WIN7打印机驱动

    5.弹出窗口中 、点击“添加本地打印” 6.使用现有端口中 选择USB端口。 一定记得 选择USB 端口~~~~ 7.选择好USB后,点击下一步。弹出窗口中点击“从磁盘安装 8.会立即弹出一个窗口。如下图: 9. 点击...

    彩云游戏浏览器-新版 v4.0.05.15.exe

    广告拦截:能拦截所有弹出的广告,阻止弹出窗口,保证畅玩游戏 8.页面静音:页面声音打开或者关闭自由控制,上网听音乐玩游戏随心所欲; 9.网页收藏夹:按照您的喜好来自定义喜欢的游戏页面到收藏夹; 10.历史记录:...

    彩云游戏浏览器 v4.0.05.15 精简版

    7.广告拦截:能拦截所有弹出的广告,阻止弹出窗口,保证畅玩游戏 8.页面静音:页面声音打开或者关闭自由控制,上网听音乐玩游戏随心所欲; 9.网页收藏夹:按照您的喜好来自定义喜欢的游戏页面到收藏夹; 10.历史...

    wisprgo:WisprGo包含一组工具,可提供具有Wispr功能的wifi AP

    WisprGo是一套工具,可提供具有Wispr功能的wifi AP,简单起见Wispr是一种协议,可在您进入免费wifi提供商(星巴克,麦当劳...)时向您显示一个弹出窗口。 我们需要此弹出窗口来将用户重定向到显示其正常工作的页面...

    O365-API-from-Office-Addin

    从Office加载项调用Office 365 API 此存储库包含一个示例,该示例显示如何从Office加载项连接到Office 365 ... 该示例强制OAuth流进入弹出窗口(而不是尝试避免弹出窗口)。 为了避免浏览器安全区域,外接程序利用We

    NC65进入节点,不需要查询,直接显示数据

    在NC65中,进入节点后,一般还需要一部查询,才能显示数据。 这里实现了,进入节点直接显示数据库中已有的数据,不需要查询

    Windowed:用于保持全屏窗口包含的 Chrome 扩展程序

    它将自身注入每个页面,并用弹出窗口替换HTMLElement.prototype.requestFullscreen (或浏览器特定版本)以进入窗口、窗口或图片模式。 对我来说重要的是切换到窗口时视频/页面不会重新加载。 模式 尽管我想创建一...

Global site tag (gtag.js) - Google Analytics