javascript - 专注于页面不工作

Question

如果存在 CSS 类，我试图将焦点设置在页面中的某个 ID 上。但是我的代码不起作用，我不确定为什么？

$(document).ready(function() {
    if ($('body').hasClass('message')) {
        $('#maincontent').focus();
    }
});

HTML: 页面中设置焦点的 anchor :

<a name="maincontent" tabindex="-1" id="maincontent"/>

如果这个 div 存在于页面中:

<div class="message success"><p><span class="glyphicon glyphicon-ok-sign" aria-hidden="true"></span> Your submission has been received.</p></div>

Answer 1

所以，基本上您要做的是转到 anchor ，而不是聚焦元素，对吧？因为您不能关注空的“a”元素。

要将焦点设置在 anchor 上试试这个

function goToAnchor(id) {
    var url = location.href;  //Save down the URL
    location.href = "#" + id; //Go to the anchor.
}​

然后你可以这样做

$(document).ready(function() {
    if ($('body').find('.message').length > 0) {
        goToAnchor('maincontent');
    }
});

要检查正文是否有具有特定类的元素，只需执行此操作

$('body').find('.message').length > 0

这里是 fiddle .

希望对您有所帮助，