Question

我制作了一个简单的Chrome扩展程序 - 使用表单进行搜索。

当我打开扩展程序时，表单上没有默认焦点，但需要额外点击。

焦点假设发生在popup.html表单上。

现在JavaScript .focus()方法无效，是否有其他方法可以为Chrome扩展程序设置默认焦点？

HTML：

<input type="text" id="mydata"  />

JS：

document.getElementById('mydata').focus();

Answer 1

最新的Chrome支持tabindex属性。所以你可以使用

<input type="text" id="mydata" tabindex="1" />

使其无需任何js代码即可运行。仅供参考。

Answer 2

Chrome扩展程序的问题是默认情况下整个popup.html文档没有焦点。因此，将焦点设置在元素上是不够的。您首先需要重新加载页面。

只需将以下代码放入页眉：

<script type="text/javascript">
        function Init () {
            if (document.hasFocus)
                setInterval ("checkFocus ()", 300);
        }
        function checkFocus () {
            if (!document.hasFocus ()) {
                document.location.reload();
            }            
        }
    document.getElementById('mydata').focus();
    </script>

然后调用身体标签中的代码：

<body onload="Init ();">

就是这样。请记住，这个解决方案只是一种解决方法。可能未来的Chrome版本会将焦点问题解决为扩展，以使此解决方案变得多余。

Answer 3

尝试这样的事情：

<html>
<head>
<script type="text/javascript">
function setFocus()
{
     document.getElementById("target").focus();
}
</script>
</head>

<body onload="setFocus()">

<input type="text" id="target" name="target" size="25" value="" />
</body>
</html>

它对我有用。

Answer 4

function setFocus(loc) {
    window.open(loc, 'popup1', 'height=655,width=710,status=yes,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=no,minimizable=no').close();
    window.open(loc, 'popup1', 'height=655,width=710,status=yes,toolbar=no,menubar=no,location=no,scrollbars=yes,resizable=no,minimizable=no').status.fixed();
}

然后：

lnkSongTitle.Attributes.Add("onclick", "javascript:setFocus('url')");

或在html onClick中致电SetFocus() function

Answer 5

Chrome支持autofocus，不需要任何JavaScript。

<input type="text" id="mydata" autofocus />

Google Chrome扩展程序中的自动对焦

5 个答案: