Предотвращение получения определенных элементов

Итак, у меня есть следующая функция. То, что он делает, - это прослушивание фокусного события для всех элементов. Если этот элемент находится либо в $mobileMenu, либо $menuItems, он в противном случае удаляет фокус:

var $body = $("body");
var $mobileMenu = $("#mobile-menu");
var $menuItems = $("#main-menu a");

$body.on("focus.spf", "*", function(e){
  e.stopPropagation();
  $this = $(this);

  // Prevent items from recieving focus and switching view
  if (!$this.is($mobileMenu) && !$this.is($menuItems)) {
    $this.blur();
  } else {
    console.log(this);
  }
})

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

Кто-нибудь знает, как я могу это сказать, вместо этого перейти к следующему настраиваемому элементу?

Ответы

Ответ 1

Это работает (обновляется):

$body.on("focus.spt", "*", function(e){
  $this = $(this);
  if (!$this.is($mobileMenu) && !$this.is($menuItems)) {
    $this.blur();
    var next=$this.nextAll().find('a,input');
    if (next.length>0) next[0].focus();
  } else {
    console.log('ok',this);
    e.stopPropagation();
  }
})

(обновлено) скрипт → http://jsfiddle.net/CADjc/ Вы можете видеть в консоли, какие элементы получают фокус (main-menu a и mobile-menu)

Протестировано:

<input type="text" tabindex="1" value="test">
<span><input type="text" tabindex="2" value="test"></span>
<div><input type="text" id="mobile-menu" tabindex="3" value="mobile-menu"></div>
<div><span>
    <div id="main-menu">
        <a tabindex="4">main-menu</a>
        <a tabindex="5">main-menu</a>
    </div>
</span></div>
<span>
<input type="text" tabindex="6" value="test">
</span>

Ответ 2

Если вы сделаете что-то неактивным, он не получит фокуса. Например:

<input type="text" disabled="disabled" />

Сделайте это программно, вы можете сделать:

var el = document.getElementById('disableme');
el.setAttribute('disabled', 'disabled');

Ответ 3

attr ( "только для чтения", "только для чтения" ), предотвратите входной фокус и значение ARE на сервер.