Установка Фокуса на ссылку, используя имя класса с Jquery

Question

Используя 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>

В настоящее время это фрагмент кода, с которым я работал до сих пор, и работая, я имею в виду, что настроил его, пока он не делает ничего заметного.

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

Я уверен, что это фактическая часть фокуса, которая не работает, хотя я не могу понять.

Answer 1

Вы можете просто позвонить .focus(), вам не нужно if:

$(".nav-button-left").focus();

В этом коде: if($(this).attr("class") == 'nav-button-left'){ ссылка this имеет контекст окна, поэтому она оценивает false, поскольку у окна нет этого класса.

Если то, что вы пытаетесь сделать, это просто вызвать его, если элемент существует, то все готово. В приведенном выше коде, если элемент не найден, .focus() просто не будет вызываться, поскольку селектор ничего не нашел.

Кроме того, если вам не нужно загружать подобные файлы перед выполнением, просто используйте этот вызов:

$(function() { //equivalent to document.ready
  $(".nav-button-left").focus();
});

Answer 2

Возможно использовать

$(this).hasClass(".nav-button-left")

вместо

$(this).attr("class") == 'nav-button-left'