时间戳

首页 > 解决方案 > 浏览器扩展 - 如何阻止自动对焦转到地址栏？

html - 浏览器扩展 - 如何阻止自动对焦转到地址栏？

问题描述

我有一个浏览器扩展，它将新标签页替换为具有漂亮背景和搜索栏的页面。使用搜索栏将用户带到谷歌并搜索查询（在同一选项卡中）。出于某种原因，使用扩展版本时，自动对焦不会进入我的搜索表单，而是进入地址栏。我无法为我的生活找出原因。我是不是在什么地方搞砸了？这是我的搜索表单：

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Search</title>
<link rel="stylesheet" type="text/css" href="popup.css" />
</head>

<body>

<div id="searchContainer">
<form action="http://google.ca/search" method="GET" >
<input id="field" type="search" name="q" size="20" placeholder="Google Search" autofocus />&nbsp;
<input id="submit" name="submit" type="submit" value="Search" />
</form>
</div>

</body>

</html>

谢谢！

标签： htmlformsgoogle-chrome-extensionautofocus

解决方案

这是在 Chrome 中硬编码以匹配内置 newtab 的行为。

它无法更改，但官方的解决方法是重定向location到另一个 URL。地址栏将显示完整的 chrome-extension:// URL。

清单.json：

"chrome_url_overrides": {
  "newtab": "focus.html"
},

焦点.html：

<script src=focus.js></script>

焦点.js：

location = 'start-focused.html';

start-focused.html将包含您的 newtab UI 的实际内容。

推荐阅读