重叠式背景关闭无法在IOS上运行

时间:2018-11-17 06:19:57

标签: jquery ios

我的网站上有一个模式窗口,其中显示搜索框。 在桌面屏幕上,当我单击背景时,它会关闭。

我的问题是,在IOS上,当我单击背景关闭时,它没有关闭。

能帮我吗?

    search_form: function () {
        var self = this,
            $searchButton = $('.search-button');

        if ($searchButton.length <= 0)
            return;

        var $searchForm = $('#search-form');
        var $searchInput = $searchForm.find('input[type="text"]');

        self.$document.on('click', function (e) {
            if (!$(e.target).is($searchInput)) {
                if ($(e.target).is($searchButton)) {
                    $searchForm.toggleClass('showing');
                    setTimeout(function () {
                        $searchInput.focus();
                        var tmpStr = $searchInput.val();
                        $searchInput.val('');
                        $searchInput.val(tmpStr);
                    }, 100);
                }
                else {
                    $searchForm.removeClass('showing');
                }

            }

        });
    },


#search-form {
position: fixed;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    background: rgba(230, 29, 114, 0.95);
    z-index: 99995 !important;
    opacity: 0;
    visibility: hidden;
    cursor: url(../img/search-close.png), ne-resize;
    overflow-x: hidden;
    overflow-y: auto;}



#search-form.showing {
    opacity: 1;
    visibility: visible;
    cursor: url(../img/search-close.png), ne-resize;}



        <div id="search-form" class="showing"><div class="search-form">
    <form role="search" method="get" class="searchform" action="#">
    <div>
    <input type="text" placeholder="Saisissez le mot clé" value="" name="s">
    <input type="hidden" name="post_type" value="product">
    </div>
    </form>

</div>          
<span id="search-caption" class="flashit">Appuyer sur la touche <strong>"Entrée"</strong> pour lancer votre recherche</span>
</div>

PS:很抱歉,格式化代码是我的第一篇文章。

谢谢你,祝你有美好的一天

0 个答案:

没有答案