灵活使用window.top

最新推荐文章于 2024-09-22 00:01:19 发布
原创 最新推荐文章于 2024-09-22 00:01:19 发布 · 2.7k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#框架 #url #web

博客讲述了以往登录时根据首页url计算并记录程序根目录，再连接成对话框页面路径的笨方法。还介绍了在框架页面中，采用window.top.showModalDialog(url...)方式，以相对于主文件的路径打开对话框，可简单实现目标。
在Web程序中，常会制作一些自己的对话框，来代替默认的alert之类的对话框，如何能让该页面在程序不同子目录下按照同样的模式使用，甚至不论该程序作为站点还是虚拟目录，都用同一种方式访问呢？

    以前我很笨地在开始登录时根据首页url，计算并记录程序的根目录，然后在访问该对话框的通用函数中，用该目录连接成对话框页面的路径。

    刚发现一个方法，当程序采用框架方式，主文件中包含几个框架，当在一个框架的页面中，不论该页面位置，只要在打开对话框页面时，不用

window.showModalDialog (url...

的方式，而采用

window.top.showModalDialog(url...

的方式，其中url是相对于主文件（顶级窗口文件目录）的路径，就可以简单地实现上述目标。

Uncaught TypeError: window.top.$(...).tabs is not a function （jeecg 打开新tab
JEFFYU328的专栏
06-28 4793
请教大神：为什么我的jeecg，curdtools_zh-cn.js里的closetab 方法关闭不了当前的标签页。具体情况：1、在首页hplushome.jsp创建了个<t:datagrid>利用<t:dgfunOpt调用自定义函数打开了个tabfunction op(id,state) { debugger; window.top.addOneTab(id,"c...
js中 window.top , window.parent , window.self 详解
zhang_zan
01-31 1676
js中 window.top , window.parent , window.self 详解
JavaScript跳出iframe框架
weixin_33770878的博客
07-13 371
一、window.toptop属性返回最顶层的先辈窗口。该属性返回对一个顶级窗口的只读引用。如果窗口本身就是一个顶级窗口，top属性存放对窗口自身的引用。如果窗口是一个框架，那么top属性引用包含框架的顶层窗口。二、window.selfself属性可返回对窗口自身的只读引用。等价于Window属性。三、window.locationwindow.location（MDN）对...
JavaScript
weixin_56341892的博客
02-10 1292
JavaScript 一、JavaScript概述 1、JavaScript JavaScript是运行在浏览器上的脚本语言。简称JS。 JavaScript是网景公司（NetScape）的 布兰登艾奇（JavaScript之父）开发的，最初叫做LiveScript。 在历史的某个阶段，SUN公司和网景公司他们之间有合作关系，SUN公司把LiveScript的名字修改为JavaScript。 JavaScript这个名字中虽然带有“Java”但是和Java没有任何关系，只是语法上优点类似。 他们运行的位置
Js中的window.parent ,window.top,window.self 详解
热门推荐
Mr. David 专栏
12-01 10万+
在应用有frameset或者iframe的页面时，parent是父窗口，top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe），self是当前窗口， opener是用open方法打开当前窗口的那个窗口。window.self功能：是对当前窗口自身的引用。它和window属性是等价的。语法：window.self注：window、self、window.self是等价的。window.top功能：返回顶层窗口，即浏览器窗口。语法：window.top注：如果窗口本身就是顶层窗口，top属
window之top属性
xiaoqiangbigbrother的博客
10-25 2870
意义：返回最顶层的先辈窗口。 使用场景： 加入有很多个iframe嵌套的时候，你要获取最外面一个document的方法或者dom元素。可以使用这个方法。
javascript中window.open在原来的窗口中打开新的窗口(不同名)
10-23
总的来说，window.open()是一个功能强大且灵活的方法，但同时需要注意浏览器的兼容性问题，并且在使用时应考虑到用户对于弹窗的接受程度和浏览器的安全限制。开发者在使用window.open()时应该遵循最佳实践，确保良好...
Window.Open详解
12-16
`window.open()` 方法是一个非常实用的功能，它可以灵活地控制新窗口的打开方式及属性。通过合理设置其参数，可以实现对新窗口的精确控制，从而满足不同的应用场景需求。同时，开发者也需要注意该方法的使用限制和...
JavaScript中window.open用法实例详解
10-24
在JavaScript编程中，window.open() 方法是一个经常被使用的方法，它可以用来打开一个新窗口，或者定位到一个指定的URL。这个方法在Web开发中非常有用，尤其是在需要弹出新窗口来显示特定内容或进行用户交互时。本篇...
在新窗口打开的跳转菜单 window.open使用介绍
09-22
总的来说，`window.open()` 是一个强大且灵活的JavaScript函数，可以帮助开发者实现各种窗口控制需求。理解其工作原理和最佳实践，对于提升网页交互体验至关重要。在实际应用中，要考虑到用户体验、浏览器兼容性和...
[removed]window.open弹出窗口的位置问题
10-26
点击按钮后，`neww()` 函数会被调用，它会读取这些输入值，并使用 `window.open()` 打开新窗口，然后通过 `myFunc.moveTo(hh, v)` 来移动窗口到指定的坐标。 请注意，现代浏览器出于用户体验和安全性的考虑，可能会...
windows top命令_top命令
weixin_39783915的博客
01-26 7188
问题Liunx的top命令如何使用？ top命令中的VIRT是什么意思？ top命令中的RES是什么意思？ top面板应该如何来看？top 命令字段含义根据 top 面板上显示的内容由上往下来看。系统运行时间和平均负载top - 14:49:00 up 157 days, 4:00, 2 users, load average: 0.00, 0.02, 0.05当前时间；（14:49:00）系统已...
window.top、window.parent、window.open、window.opener
weixin_34403693的博客
08-29 1187
地址：http://blog.csdn.net/zdwzzu2006/article/details/6047632在应用有frameset或者iframe的页面时，parent是父窗口，top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe），self是当前窗口， opener是用open方法打开当前窗口的那个窗口。window.self功能：是对当前...
JavaScript window.parent、window.self、window.top
weixin_44443380的博客
01-25 1097
（1）window.top === window.self 为true表示当前窗口就是顶层窗口，没有iframe应用；在应用有frameset或者iframe的页面时，parent是父窗口，top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe），self是当前窗口。在框架网页中，一般父窗口就是顶层窗口，但如果框架中还有框架，父窗口和顶层窗口就不一定相同了。注意：如果窗口本身是顶层窗口，parent属性返回的是对自身的引用。功能：返回顶层窗口，即浏览器窗口。
js中window.parent和window.top
hangGe0111的博客
06-27 2011
1.在使用iframe时，parent是父集窗口，top是顶级窗口；2.当自己是顶级窗口:    (1)则top返回的是自身;    (2)则parent:        ①当顶级窗口外没有框架时，是自身；        ②当顶级窗口外还有框架，则还有父集。...
window.parent 和 window.top方法的使用
花木难
03-19 5503
前一段时间在做搜狐家居商城申请入驻时用到了window.parent这一方法。       由于上传图片的服务器是在另一域名上，和网站服务器是分开的。考虑到跨域。因此上传图片的form表单写到了一个单独的tpl文件中(http://jia.focus.cn/merchantapply/apply/1)页面(A)的上传营业授权资质Button时，打开一个弹层，用Firefox的fireBug
【JavaScript 教程】浏览器—window 对象
web前端开发
03-05 1008
作者 | 阮一峰1、概述浏览器里面，window对象（注意，w为小写）指当前的浏览器窗口。它也是当前页面的顶层对象，即最高一层的对象，所有其他对象都是它的下属。一个变量如果未声明，那么默...
Javascript中window.parent ,top,self,opener 详解
qq_30436011的博客
08-13 1314
的页面时，parent是父窗口，top是最顶级父窗口（有的窗口中套了好几层frameset或者iframe），self是当前窗口， opener是用open方法打开当前窗口的那个窗口。一个浏览器窗口可以根据你的需要分成任意多的框架，一个单个的框架也可以分成其它多个框架，即所谓的嵌套框架。在框架网页中，一般父窗口就是顶层窗口，但如果框架中还有框架，父窗口和顶层窗口就不一定相同了。注：如果窗口本身是顶层窗口，parent属性返回的是对自身的引用。注：如果窗口本身就是顶层窗口，top属性返回的是对自身的引用。..
JavaScript学习笔记：第四篇——window对象的属性及方法
2301_80154757的博客
09-22 1730
利用history对象可以获取窗口历史记录，history对象是一个只读的URL字符串数组，该对象主要用来存储一个最新访问网页的URL地址的列表，可通过window.history属性对其进行访问。如果当前窗口是在框架<frame>或<iframe>中，通过window对象的frameElement属性可获取当前窗口所在的框架对象。框架可以把浏览器窗口分成几个独立的部分，每部分显示单独的页面，页面的内容是互相联系的，框架是一种特殊的窗口。window对象是客户端程序的全局对象，该对象包含多个属性。
弹窗是使用window.addview弹出的
最新发布
03-20
<think>嗯，用户现在问的是关于使用`Window.addView`来弹出弹窗的介绍。我需要先理解用户的问题到底是想了解什么。用户可能正在开发Android应用，遇到了需要自定义弹窗的情况，而常见的Dialog或PopupWindow可能无法满足需求，所以转而使用`Window.addView`这种方法。 首先，我需要回顾一下Android中窗口管理的基本知识。`Window`在Android中代表一个顶层窗口，通常与Activity关联。通过`getWindow()`方法获取当前Activity的Window对象，然后使用`addView()`方法可以直接添加视图到窗口上。这种方式比较底层，可以更灵活地控制弹窗的位置、样式等，但同时也需要处理更多细节，比如触摸事件、焦点管理、生命周期等。 接下来，用户提到的“弹窗是使用window.addview弹出的”可能指的是直接向Window添加View来实现弹窗效果。这种情况下，弹窗可能是一个悬浮在Activity之上的视图，类似于Toast，但需要更多的自定义控制。常见的应用场景可能是全屏弹窗、自定义位置的悬浮窗，或者需要特殊动画效果的弹窗。 用户可能已经尝试过其他弹窗组件，比如AlertDialog或PopupWindow，但发现它们不够灵活，或者在某些情况下存在限制。例如，PopupWindow在某些系统版本上可能有位置或触摸事件处理的问题，而Dialog可能会占用整个Activity窗口，影响用户体验。因此，用户转向使用`Window.addView`来实现更底层的控制。 接下来，我需要考虑用户可能遇到的问题。使用`Window.addView`需要手动处理很多细节，比如设置正确的窗口类型（Type）、Flag、触摸事件拦截、背景模糊或半透明效果，以及如何正确关闭弹窗。如果处理不当，可能会导致内存泄漏、UI错乱或者触摸事件无法正确传递。 例如，窗口类型通常需要设置为`TYPE_APPLICATION_PANEL`或`TYPE_APPLICATION_OVERLAY`（后者需要权限），以确保弹窗显示在正确的位置。同时，需要设置Flag如`FLAG_NOT_FOCUSABLE`或`FLAG_NOT_TOUCH_MODAL`来控制焦点和触摸行为。用户可能对如何正确设置这些参数不太清楚，导致弹窗无法显示或行为异常。 另外，触摸事件的处理也是一个关键点。用户可能希望点击弹窗外部关闭弹窗，这需要判断触摸事件是否发生在弹窗区域内，如果是外部区域则关闭。这涉及到计算View的位置和判断触摸坐标是否在View的边界内，或者使用遮罩层来捕获触摸事件。 此外，内存管理和生命周期也是需要注意的地方。如果弹窗没有正确移除，可能会导致Window泄漏，进而引发内存问题。用户可能不清楚在何时调用`removeView`或`removeViewImmediate`来正确销毁弹窗。 还有，样式和动画的设置。使用`Window.addView`创建的弹窗可能需要自定义进入和退出动画，或者设置背景透明、圆角等视觉效果。用户可能需要指导如何通过Window的Attributes来设置这些属性。 综合来看，用户的需求不仅仅是了解如何使用`Window.addView`弹出弹窗，而是希望获得一个完整的实现指南，包括正确的窗口参数配置、触摸事件处理、样式设置以及生命周期管理。可能还需要对比其他弹窗实现方式的优缺点，帮助用户理解在什么情况下选择`Window.addView`更合适。 另外，用户可能是在处理一些特殊的UI需求，比如游戏中的HUD、浮动按钮或者需要跨Activity显示的悬浮窗，这时候使用`Window.addView`会更灵活。但需要注意，从Android 8.0（API 26）开始，`TYPE_APPLICATION_OVERLAY`需要请求权限，否则无法显示，这可能也是用户需要注意的地方。 最后，用户可能还关心性能优化，比如如何避免频繁添加和移除View导致的界面卡顿，或者如何正确管理多个弹窗的层级关系。这些都是使用底层Window管理时需要综合考虑的问题。</think>在 Android 开发中，通过 `Window.addView()` 直接向窗口添加视图（View）是一种底层的弹窗实现方式。这种方式常用于**高度自定义的悬浮窗**（如系统级提示、游戏内悬浮按钮等），但需要开发者手动管理窗口参数、触摸事件和生命周期。以下是具体实现方法和关键点： --- ### 一、核心原理 - **`Window` 对象**：每个 Activity 都关联一个 `Window`（通过 `getWindow()` 获取），负责管理窗口的视图层级。 - **`WindowManager`**：通过 `WindowManager`（实际是 `WindowManagerImpl`）控制窗口的添加、更新和移除。 - **层级控制**：通过设置 `WindowManager.LayoutParams` 的 `type` 和 `flags` 属性，控制弹窗的显示位置、行为（如是否可点击、是否拦截焦点）。 --- ### 二、实现步骤（以 Activity 内弹窗为例） #### 1. 创建自定义弹窗布局 ```xml <!-- res/layout/custom_dialog.xml --> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/dialog_root" android:layout_width="300dp" android:layout_height="200dp" android:background="#FFFFFF" android:orientation="vertical"> <TextView android:text="这是一个自定义弹窗" android:layout_width="match_parent" android:layout_height="wrap_content"/> </LinearLayout> ``` #### 2. 通过 `WindowManager` 添加弹窗 ```java // 在 Activity 中实现 public void showCustomDialog() { // 1. 加载布局 View dialogView = LayoutInflater.from(this).inflate(R.layout.custom_dialog, null); // 2. 设置窗口参数 WindowManager.LayoutParams params = new WindowManager.LayoutParams(); params.width = WindowManager.LayoutParams.WRAP_CONTENT; // 宽度 params.height = WindowManager.LayoutParams.WRAP_CONTENT; // 高度 params.format = PixelFormat.TRANSLUCENT; // 透明背景 params.type = WindowManager.LayoutParams.TYPE_APPLICATION_PANEL; // 类型（普通应用窗口） params.flags = WindowManager.LayoutParams.FLAG_NOT_TOUCH_MODAL // 不阻塞下层触摸事件 | WindowManager.LayoutParams.FLAG_WATCH_OUTSIDE_TOUCH; // 监听外部点击 // 3. 添加视图到窗口 WindowManager windowManager = getWindowManager(); windowManager.addView(dialogView, params); } ``` #### 3. 处理外部点击关闭 ```java dialogView.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { // 判断是否为外部点击 if (event.getAction() == MotionEvent.ACTION_OUTSIDE) { // 移除弹窗 WindowManager windowManager = (WindowManager) getSystemService(WINDOW_SERVICE); windowManager.removeView(dialogView); return true; } return false; } }); ``` --- ### 三、关键参数详解（`WindowManager.LayoutParams`） | 参数 | 说明 | 常用值 | |------|------|--------| | `type` | 窗口层级类型 | `TYPE_APPLICATION_PANEL`（普通弹窗）<br/>`TYPE_APPLICATION_OVERLAY`（系统级悬浮窗，需权限） | | `flags` | 控制窗口行为 | `FLAG_NOT_FOCUSABLE`（不获取焦点）<br/>`FLAG_NOT_TOUCH_MODAL`（透传触摸事件）<br/>`FLAG_DIM_BEHIND`（背景变暗） | | `gravity` | 弹窗位置 | `Gravity.CENTER`、`Gravity.TOP` 等 | | `dimAmount` | 背景变暗程度 | `0.0f`（透明）~ `1.0f`（全黑） | --- ### 四、注意事项 1. **权限问题**： - `TYPE_APPLICATION_OVERLAY` 需要动态请求 `SYSTEM_ALERT_WINDOW` 权限。 - 从 Android 10 开始，非系统应用无法使用 `TYPE_PHONE` 等类型。 2. **内存泄漏**： - 确保在 `Activity.onDestroy()` 或 `Fragment.onDestroyView()` 中调用 `removeView()`。 3. **触摸事件冲突**： - 若设置 `FLAG_NOT_TOUCH_MODAL`，需自行处理事件传递逻辑。 4. **动画效果**： - 可通过 `WindowManager.LayoutParams.windowAnimations` 设置进入/退出动画。 --- ### 五、对比其他弹窗方案 | 方案 | 优点 | 缺点 | |------|------|------| | **`Window.addView()`** | 完全自定义、可跨 Activity | 需手动管理生命周期 | | **`Dialog`** | 封装完善、自带生命周期 | 样式受系统限制 | | **`PopupWindow`** | 支持锚点定位 | 触摸事件处理复杂 | --- ### 六、扩展问题 1. **动态调整窗口大小** 修改 `LayoutParams` 后调用 `windowManager.updateViewLayout(view, params)`。 2. **跨进程弹窗** 需要权限且类型为 `TYPE_APPLICATION_OVERLAY`，但可能被系统限制。 如果需要进一步探讨某个具体问题（如权限申请、复杂动画），可以继续提问！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值