Open popup window with open.window method

本文提供了一个使用 JavaScript 实现特定弹窗功能的示例代码。通过简单的 HTML 和 JavaScript 交互,可以创建带有特定尺寸和属性的弹窗窗口,适用于网页开发中需要快速实现定制化弹窗的应用场景。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >



<a href="javascript: void(0)" onclick="window.open('popup.html', 'windowname2', 'width=200, \ height=77, \ directories=no, \ location=no, \ menubar=no, \ resizable=no, \ scrollbars=1, \ status=no, \ toolbar=no'); return false;">Click here for specific popup window</a>


来源:http://javascript-array.com/scripts/window_open

/* * Copyright (C) 2010 The Android Open Source Project * * Licensed under the Apache License, Version 2.0 (the "License"); * you may not use this file except in compliance with the License. * You may obtain a copy of the License at * * http://www.apache.org/licenses/LICENSE-2.0 * * Unless required by applicable law or agreed to in writing, software * distributed under the License is distributed on an "AS IS" BASIS, * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. * See the License for the specific language governing permissions and * limitations under the License. */ package android.widget; import android.annotation.MenuRes; import android.annotation.TestApi; import android.compat.annotation.UnsupportedAppUsage; import android.content.Context; import android.os.Build; import android.view.Gravity; import android.view.Menu; import android.view.MenuInflater; import android.view.MenuItem; import android.view.View; import android.view.View.OnTouchListener; import com.android.internal.R; import com.android.internal.view.menu.MenuBuilder; import com.android.internal.view.menu.MenuPopupHelper; import com.android.internal.view.menu.ShowableListMenu; /** * A PopupMenu displays a {@link Menu} in a modal popup window anchored to a * {@link View}. The popup will appear below the anchor view if there is room, * or above it if there is not. If the IME is visible the popup will not * overlap it until it is touched. Touching outside of the popup will dismiss * it. */ public class PopupMenu { @UnsupportedAppUsage(maxTargetSdk = Build.VERSION_CODES.R, trackingBug = 170729553) private final Context mContext; private final MenuBuilder mMenu; private final View mAnchor; @UnsupportedAppUsage private final MenuPopupHelper mPopup; private OnMenuItemClickListener mMenuItemClickListener; private OnDismissListener mOnDismissListener; private OnTouchListener mDragListener; /** * Constructor to create a new popup menu with an anchor view. * * @param context Context the popup menu is running in, through which it * can access the current theme, resources, etc. * @param anchor Anchor view for this popup. The popup will appear below * the anchor if there is room, or above it if there is not. */ public PopupMenu(Context context, View anchor) { this(context, anchor, Gravity.NO_GRAVITY); } /** * Constructor to create a new popup menu with an anchor view and alignment * gravity. * * @param context Context the popup menu is running in, through which it * can access the current theme, resources, etc. * @param anchor Anchor view for this popup. The popup will appear below * the anchor if there is room, or above it if there is not. * @param gravity The {@link Gravity} value for aligning the popup with its * anchor. */ public PopupMenu(Context context, View anchor, int gravity) { this(context, anchor, gravity, R.attr.popupMenuStyle, 0); } /** * Constructor a create a new popup menu with a specific style. * * @param context Context the popup menu is running in, through which it * can access the current theme, resources, etc. * @param anchor Anchor view for this popup. The popup will appear below * the anchor if there is room, or above it if there is not. * @param gravity The {@link Gravity} value for aligning the popup with its * anchor. * @param popupStyleAttr An attribute in the current theme that contains a * reference to a style resource that supplies default values for * the popup window. Can be 0 to not look for defaults. * @param popupStyleRes A resource identifier of a style resource that * supplies default values for the popup window, used only if * popupStyleAttr is 0 or can not be found in the theme. Can be 0 * to not look for defaults. */ public PopupMenu(Context context, View anchor, int gravity, int popupStyleAttr, int popupStyleRes) { mContext = context; mAnchor = anchor; mMenu = new MenuBuilder(context); mMenu.setCallback(new MenuBuilder.Callback() { @Override public boolean onMenuItemSelected(MenuBuilder menu, MenuItem item) { if (mMenuItemClickListener != null) { return mMenuItemClickListener.onMenuItemClick(item); } return false; } @Override public void onMenuModeChange(MenuBuilder menu) { } }); mPopup = new MenuPopupHelper(context, mMenu, anchor, false, popupStyleAttr, popupStyleRes); mPopup.setGravity(gravity); mPopup.setOnDismissListener(new PopupWindow.OnDismissListener() { @Override public void onDismiss() { if (mOnDismissListener != null) { mOnDismissListener.onDismiss(PopupMenu.this); } } }); } /** * Sets the gravity used to align the popup window to its anchor view. * <p> * If the popup is showing, calling this method will take effect only * the next time the popup is shown. * * @param gravity the gravity used to align the popup window * @see #getGravity() */ public void setGravity(int gravity) { mPopup.setGravity(gravity); } /** * @return the gravity used to align the popup window to its anchor view * @see #setGravity(int) */ public int getGravity() { return mPopup.getGravity(); } /** * Returns an {@link OnTouchListener} that can be added to the anchor view * to implement drag-to-open behavior. * <p> * When the listener is set on a view, touching that view and dragging * outside of its bounds will open the popup window. Lifting will select * the currently touched list item. * <p> * Example usage: * <pre> * PopupMenu myPopup = new PopupMenu(context, myAnchor); * myAnchor.setOnTouchListener(myPopup.getDragToOpenListener()); * </pre> * * @return a touch listener that controls drag-to-open behavior */ public OnTouchListener getDragToOpenListener() { if (mDragListener == null) { mDragListener = new ForwardingListener(mAnchor) { @Override protected boolean onForwardingStarted() { show(); return true; } @Override protected boolean onForwardingStopped() { dismiss(); return true; } @Override public ShowableListMenu getPopup() { // This will be null until show() is called. return mPopup.getPopup(); } }; } return mDragListener; } /** * Returns the {@link Menu} associated with this popup. Populate the * returned Menu with items before calling {@link #show()}. * * @return the {@link Menu} associated with this popup * @see #show() * @see #getMenuInflater() */ public Menu getMenu() { return mMenu; } /** * @return a {@link MenuInflater} that can be used to inflate menu items * from XML into the menu returned by {@link #getMenu()} * @see #getMenu() */ public MenuInflater getMenuInflater() { return new MenuInflater(mContext); } /** * Inflate a menu resource into this PopupMenu. This is equivalent to * calling {@code popupMenu.getMenuInflater().inflate(menuRes, popupMenu.getMenu())}. * * @param menuRes Menu resource to inflate */ public void inflate(@MenuRes int menuRes) { getMenuInflater().inflate(menuRes, mMenu); } /** * Show the menu popup anchored to the view specified during construction. * * @see #dismiss() */ public void show() { mPopup.show(); } /** * Dismiss the menu popup. * * @see #show() */ public void dismiss() { mPopup.dismiss(); } /** * Sets a listener that will be notified when the user selects an item from * the menu. * * @param listener the listener to notify */ public void setOnMenuItemClickListener(OnMenuItemClickListener listener) { mMenuItemClickListener = listener; } /** * Sets a listener that will be notified when this menu is dismissed. * * @param listener the listener to notify */ public void setOnDismissListener(OnDismissListener listener) { mOnDismissListener = listener; } /** * Sets whether the popup menu's adapter is forced to show icons in the * menu item views. * <p> * Changes take effect on the next call to show(). * * @param forceShowIcon {@code true} to force icons to be shown, or * {@code false} for icons to be optionally shown */ public void setForceShowIcon(boolean forceShowIcon) { mPopup.setForceShowIcon(forceShowIcon); } /** * Interface responsible for receiving menu item click events if the items * themselves do not have individual item click listeners. */ public interface OnMenuItemClickListener { /** * This method will be invoked when a menu item is clicked if the item * itself did not already handle the event. * * @param item the menu item that was clicked * @return {@code true} if the event was handled, {@code false} * otherwise */ boolean onMenuItemClick(MenuItem item); } /** * Callback interface used to notify the application that the menu has closed. */ public interface OnDismissListener { /** * Called when the associated menu has been dismissed. * * @param menu the popup menu that was dismissed */ void onDismiss(PopupMenu menu); } /** * Returns the {@link ListView} representing the list of menu items in the currently showing * menu. * * @return The view representing the list of menu items. * @hide */ @TestApi public ListView getMenuListView() { if (!mPopup.isShowing()) { return null; } return mPopup.getPopup().getListView(); } }
最新发布
06-08
### 解决方案 当 `window.location.href` 无法触发文件下载时,通常是因为浏览器的行为机制或者特定场景下的限制所导致。以下是几种可能的解决方案: #### 方法一:通过创建隐藏表单提交实现文件下载 可以利用 HTML 表单的功能来替代 `window.location.href` 的行为。这种方式适用于服务器端支持 POST 请求的情况。 ```javascript const formDownload = (url, params) => { const form = document.createElement('form'); form.method = 'POST'; form.action = url; form.target = '_self'; Object.keys(params).forEach(key => { const hiddenField = document.createElement('input'); hiddenField.type = 'hidden'; hiddenField.name = key; hiddenField.value = params[key]; form.appendChild(hiddenField); }); document.body.appendChild(form); form.submit(); }; ``` 这种方法的优点在于能够传递额外参数给服务端[^1]。 --- #### 方法二:使用 `window.open` 实现文件下载 如果目标 URL 是一个可以直接访问并返回文件流的链接,则可以通过调用 `window.open` 来打开一个新的窗口或标签页进行下载。为了避免多次下载的问题,可以在下载完成后手动关闭该窗口。 ```javascript const safeDownload = (url) => { const popup = window.open(url, '_blank'); if (!popup || popup.closed || typeof popup === 'undefined') { alert('Please disable your pop-up blocker and try again.'); } }; ``` 此方法需要注意的是某些情况下可能会被弹窗拦截器阻止[^2]。 --- #### 方法三:借助 Blob 和 a 标签模拟点击事件 对于现代浏览器而言,推荐的做法是从 API 获取到文件数据作为 Blob 对象处理后再生成临时链接供用户下载。 ```javascript async function fetchAndDownloadFile(fileUrl, fileName) { try { const response = await fetch(fileUrl); if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`); const blob = await response.blob(); const link = document.createElement('a'); link.href = URL.createObjectURL(blob); link.download = fileName || 'downloaded-file'; document.body.appendChild(link); link.click(); // Clean up the temporary object URL after use. setTimeout(() => { document.body.removeChild(link); URL.revokeObjectURL(link.href); }, 0); } catch (error) { console.error('Error during file fetching:', error.message); } } ``` 这种技术的优势在于它完全绕过了传统意义上的导航操作,因此不会影响当前页面状态[^4]。 --- ### 注意事项 - 如果遇到跨域资源请求失败,请确认 CORS 设置是否允许客户端读取响应头中的 Content-Disposition 字段。 - 当涉及敏感信息传输时务必采用 HTTPS 协议保护通信安全。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值