使用jQuery Spoiler API自动聚焦输入

时间:2017-02-01 18:51:46

标签: jquery html

我使用此jQuery Spoiler on GitHub并尝试自动输入输入(这是一个隐藏的移动搜索栏),同时扰流内容可见。 Spoiler拥有自己的API或更多触发事件'试图与this artikel结合。问题我是jQuery的新手,所以我甚至不知道事件是否被触发。

受损的内容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);

1 个答案:

答案 0 :(得分:0)

尝试使用id $(“#search”)。focus();