使用Jquery使用类名将焦点设置为链接

Vik*_*oat 5 html css jquery

使用jQuery我试图根据类名从页面加载的相关链接列表中为(CSS目的)设置焦点到特定链接.

例如,以下我想将焦点设置为Link1

<a href="#Link1" class="nav-button-left">Link1</a>
<a href="#Link2" class="nav-button">Link2</a>
<a href="#Link3" class="nav-button">Link3</a>
<a href="#Link4" class="nav-button">Link4</a>
<a href="#Link5" class="nav-button">Link5</a>
<a href="#Link6" class="nav-button-right">Link6</a>
Run Code Online (Sandbox Code Playgroud)

目前这是我到目前为止工作的代码片段,通过工作我的意思是我已经设置它,到目前为止它没有任何明显的作用.

<script type="text/JavaScript">
    $(window).load(function(){
        if($(this).attr("class") == 'nav-button-left'){$(".nav-button-left").focus();}  
    })
</script>
Run Code Online (Sandbox Code Playgroud)

我很确定它的实际焦点部分不起作用,尽管我无法理解.

Nic*_*ver 12

你可以打电话.focus(),你不需要if:

$(".nav-button-left").focus();
Run Code Online (Sandbox Code Playgroud)

在此代码中: if($(this).attr("class") == 'nav-button-left'){引用this具有窗口上下文,因此它评估为false,因为窗口没有该类.

如果你想要做的只是在元素存在的情况下调用它,那么你就可以了.在上面的代码中,如果找不到该元素,则.focus()由于选择器没有找到任何内容,因此不会被调用.

此外,除非您在执行之前需要加载类似图像的东西,否则只需使用此调用:

$(function() { //equivalent to document.ready
  $(".nav-button-left").focus();
});
Run Code Online (Sandbox Code Playgroud)