个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
26
4
我有一个应用程序，它基本上只是公司内部网站的包装器。这个想法是在我的 Chromebook 上的自己的窗口中轻松加载网站，这样它就不会在 RAM 变低时卸载。
我有一个非常简单的应用程序，其中包含一个占用整个应用程序窗口的 WebView。问题是，每当我离开窗口再回来时，webview 就会失去焦点。这特别烦人，因为它是一个聊天应用程序，我想在按 alt-tab 键回到窗口后立即开始聊天。
每次窗口获得焦点时，我都研究过聚焦 webview，但是 Window(来自 chrome.windows)和 AppWindow(来自 chrome.app.window)之间的断开使得这很重要。我需要的事件只存在于 Window 对象中，但我只能确定地获取当前的 AppWindow。理论上我可以在应用程序首次启动时获得当前事件的窗口，但这似乎很老套且不可靠。
<!DOCTYPE html>
<html>
<head>
<title>Chat App</title>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<webview src="https://example.com/" id="chat"></webview>
</body>
</html>
chrome.app.runtime.onLaunched.addListener(function(launchData) {
chrome.app.window.create(
'index.html',
{
id: 'chat'
}
);
});
让 webview 占用整个窗口有点棘手；我必须使用一些冗余的 CSS 属性才能使其正常工作。
html, body {
margin: 0;
padding: 0;
overflow: hidden;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
}
#chat {
border: 0 none;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
}
最佳答案
您可以简单地使用 Page Visibility API 来实现这一点.您可以使用它来添加事件监听器并检查 document.hidden 状态以将焦点返回到聊天框。您还可以执行其他操作，例如在标签不可见时收到聊天消息时播放音频提醒。
在此示例中，我还向第一个聊天框添加了一个事件监听器，因此如果焦点丢失，它会尝试再次获取它。这是一种相当笨拙的方法，但您可以调整逻辑以满足要求。
function handleVisibilityChange() {
console.log(document.hidden);
if (!document.hidden) {
chatFocus();
}
}
function chatFocus() {
document.getElementById("ChatBox1").focus();
}
document.addEventListener("visibilitychange", handleVisibilityChange, false);
document.getElementById("ChatBox1").addEventListener("blur", chatFocus, true);<input type="text" id="ChatBox1" placeholder="ChatBox1">
<input type="text" id="ChatBox2" placeholder="ChatBox2">在 Chrome 上对此进行测试，您会发现如果切换到另一个选项卡或最小化窗口，则会触发 visibilitychange 事件。但是，如果您只是切换到另一个窗口，它不会认为该页面已隐藏。通常，您还可以使用 window.onblur 来监听页面何时失去焦点。
附言。关于你的“棘手”冗余 CSS:指定 left: 0 和 width: 100% 应该是你所需要的(right: 0 不应该是必要的)，但除此之外，文本字段往往具有边框和填充等。因此，为了确保该字段最终不会比其容器宽，您需要设置 box-sizing: border- box 以便在确定其大小时包含填充和边框。这是解决 CSS 中许多问题的技巧。
关于javascript - Webview 不断失去焦点，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31148052/
26
4
0
如果这不是一个错误，那就是另一个错误。如果不是那样的话，那就是别的东西了。我觉得我的项目已经改变了很多，现在只是试图解决代码签名问题，结果一切都搞砸了。我严格按照说明进行操作，但出现错误，例如当前的“
我不确定是否有一些我不知道的内置变量或规则，或者 make 是否有问题，或者我只是疯了。 对于我的一个项目，我有一个如下的 makefile: CC=g++ CFLAGS=-O3 `libpng-co
我有大约 10 个 div，它们必须不断翻转，每个 div 延迟 3 秒 这个 codrops 链接的最后一个效果是我正在寻找的，但无需单击 div http://tympanus.net/Devel
我如何使用 jQuery 持续运行 PHP 脚本并每秒获取响应，以及将鼠标上的少量数据发送到同一脚本？ 我真的必须添加一些随机扩展才能让这么简单的计时器工作吗？ 最佳答案 To iterate is
JBoss 4.x EJB 3.0 我见过如下代码(大大简化): @Stateless @TransactionAttribute(TransactionAttributeType.NOT_SUPPO
使用 PHPStorm，我试图忽略每次尝试进行 git 提交时 pop 的 workspace.xml。 我的 .gitignore 看起来像: /.idea/ .idea/workspace.xml
我是一名优秀的程序员,十分优秀！