2017-02-01 1 views
1

私はこのjQuery Spoiler on GitHubを使用していますが、スポイラーのコンテンツが表示されている間、オートフーカス入力(隠しモバイル検索バー)をしようとしています。 Spoilerには、this artikelと組み合わせて使用​​しようとした独自のAPI以上の「トリガーイベント」があります。問題はjQueryの新機能です。イベントが発生するかどうかはわかりません。jQuery Spoiler APIを使用してオートフォーカス入力

甘やかされて育ったコンテンツHTML:

<div class="flex-col flex-absolut"> 
    <form id="search-form" action="/" method="get"> 
     <div class="form-inner"> 
      <input type="text" name="s" id="search" placeholder="Search..." value=""> 
      <div class="button-overlay"> 
       <input type="image" id="button" alt=""> 
      </div> 
     </div> 
    </form> 
</div> 

ボタンのHTML

<li id="menu-item" class="search-toggle spoiler" data-spoiler-link="Q5KQS88F"> 
     <a class="search-toggle"><?php _e('Search', 'bresponZive'); ?></a> 
</li> 

JS

(function($) { 

    $(function() { //Equivalent to $(document).ready 
     $(".search-toggle").spoiler({ 
     // The Spoiler basic setup 
     contentClass:   'search-mode', 
     spoilerVisibleClass: 'active', 
     triggerEvents:   true, 
     }); 

     // Should get triggered and set the autofocus 
     jQuery(".search-toggle").on("jq-spoiler-visible", function() { 
     $(".flex-col.flex-absolut [name='s']").focus(); 
     }); 
    }); 

})(jQuery); 
+0

提供されたhtmlに '.search-toggle'要素はありません – empiric

+0

私はボタンを忘れてしまいました。非常に申し訳ございません。 –

答えて

0

てみ使用のid $( "#検索")フォーカス();。

+0

ヘルプが役立つかどうかは、私のサイトです。https://en.unicstack.com/data/geography-id = 11 –

+0

$( "。search-toggle")on( "click"、function(){ $( "#search")。focus(); }); – aisthetes

+0

私はこの 'jQuery("。search-toggle ")に置き換えました。(" jq-spoiler-visible "、function(){ $(" flex-col.flex-absolut [name = 's']] ").focus(); });'それでも動作しません:( –

関連する問題