Присвойте вкладке новую загруженную страницу

Question

У меня есть боковое навигационное меню веб-страницы и панель контента справа. На панели контента есть текст и фрейм. При переходе по меню навигации с вкладкой и входу в любой пункт меню будет загружаться соответствующий контент. на панель содержимого. Даже содержимое, загружаемое на вкладку панели, находится в меню навигации.

Мне нужно назначить фокус вкладки для текста или для фрейма в области содержимого при каждой новой загрузке содержимого. пробовал с tabindex ..

<a href="" tabindex="1">test text for tab focus</a>
<div id="content-frame" class="fill center-content">   

    <div id="content-frame-loading" class="load-img"><img ng-src="{{loadingIconUrl}}" alt="{{$scope.loadingSpinnerAltText}}"></div>

    <iframe id="centerIframe" name="centerIframe" class="fill content-frame"  src="" orientable height="100%" width="100%" ng-style="{'height' : settings.iFrameHeight}" webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen="true" allowtransparency="true">
    </iframe>

</div>

Выше приведен блок кода панели содержимого.

Answer 1

только установка tabindex не решит цель. tabindex добавит узел dom в последовательность вкладок и будет фокусироваться на нажатии вкладки , когда его ход наступит в соответствии с последовательностью.

Здесь вы настраиваете tabindex, но, кроме того, вы также хотите, чтобы контент автоматически фокусировался, поэтому вам придется написать некоторый скрипт для достижения этого.

Таким образом, если ваш контент является частью компонента, вы можете вручную сфокусировать нужный элемент на загрузке этого компонента в любой из ловушек жизненного цикла.

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