.onkeydown仅在关注一个元素

Question

我为我的滑块做了键盘控制。但我有一个问题，即使我输入输入搜索它也会生效。如何让它只在我专注于滑块时生效？

我的HTML：

<nav class="grey lighten-3 search"> // I don't want this element to be take effect by window.onkeydown
    <div class="nav-wrapper">
      <div class="searchbox">
        <form>
          <div class="input-field">
            <input id="search" type="search" required>
            <label for="search"><i class="material-icons">search</i></label>
          </div>
        </form>
      </div>
    </div>
</nav>

这是我的滑块HTML：

<div class="row slider-container">
  <div class="col s12 category">
    <p>Slide</p>
  </div>
  <div id="slide" class="slider-content carousel col s12">
    <div class="item">
      <a href="#"><img class="lazyload" data-src="http://img02.deviantart.net/82fc/i/2013/175/2/7/aku_no_hana__poster_i__by_fikandzo-d6airxz.png" alt="Lazy Image">
      Caption</a>
    </div>
    <div class="item">
      <a href="#"><img class="lazyload" data-src="http://img02.deviantart.net/82fc/i/2013/175/2/7/aku_no_hana__poster_i__by_fikandzo-d6airxz.png" alt="Lazy Image">
      Caption</a>
    </div>
    <div class="item">
      <a href="#"><img class="lazyload" data-src="http://img02.deviantart.net/82fc/i/2013/175/2/7/aku_no_hana__poster_i__by_fikandzo-d6airxz.png" alt="Lazy Image">
      Caption</a>
    </div>
    <div class="item">
      <a href="#"><img class="lazyload" data-src="http://img02.deviantart.net/82fc/i/2013/175/2/7/aku_no_hana__poster_i__by_fikandzo-d6airxz.png" alt="Lazy Image">
      Caption</a>
    </div>
  </div>
</div>

我的剧本：

    document.onkeydown = function() {
            switch (window.event.keyCode) {
            case 37:
            abb.trigger('abb.prev');
            break;
            case 39:
            abb.trigger('abb.next');
            break;
            case 65:
            abb.trigger('abb.prev');
            break;
            case 68:
            abb.trigger('abb.next');
            break;
            }
    };