自动完成搜索在 mozilla 中有效，但在 chrome 和其他浏览器中无效答案

【问题标题】：Autocomplete search working in mozilla but not in chrome and other browsers自动完成搜索在 mozilla 中有效，但在 chrome 和其他浏览器中无效
【发布时间】：2017-01-17 09:20:29
【问题描述】：

在网站中，“自动完成搜索建议结果”。显示在all pages。

但现在“自动完成搜索建议结果”不仅在 chrome 和其他浏览器中的 home page 中显示，而是在 mozilla firefox 中显示...。 p>

<script type="text/javascript">
    //<![CDATA[
        var ajaxUrl='<?php echo Mage::helper('searchsuggest')->getAjaxurl(); ?>';
        var queryDelay = 0.5;
        var progressImage ='<?php echo $this->getSkinUrl('images/ajax-loader.gif');?>';
        var minCharacters = '<?php echo Mage::helper('searchsuggest')->getMinChar(); ?>';

        document.observe('dom:loaded',function(){
            //require(["autocomplete"], function(){
                $$('.form-search')[0].insert({
                    after:'<div id="search-autocomplete"><div id="searchr-result-containter"><div id="autocomplete-content"><div id="search-result"></div></div></div></div>'
                });
                $('searchr-result-containter').hide();
                var acLayout = new Autocomplete();
                acLayout.initAutocomplete(ajaxUrl, 'search-result');
            //});
        })
    //]]>
</script>

demo：如果你打开link，你会在右上角看到3个小图标，如果你点击第一个图标，会出现搜索框，然后你可以输入“iphone”并等待大约1分钟... .

编辑

问题的原因是出现在顶部的横幅滑块，一旦我将其删除，现在“自动完成搜索”在所有浏览器中都可以使用

【问题讨论】：

$$('.form-search')[0].insert( 中的双 $ 是什么
@A.Lau 我们正在使用插件，我也是 js 新手，抱歉我对此一无所知.....
尝试删除 $ 之一，看看会发生什么。我认为这不适合我。
@A.Lau 我试过了，之后autocomplete search 也没有在 mozilla 浏览器中工作.....
它是因为banner slider 出现在顶部，一旦我删除了那个横幅滑块，它就可以在其他浏览器中工作，但我需要那个横幅滑块......你可以检查here

标签： google-chrome

【解决方案1】：

问题： 您已将搜索表单包含在 #header-search 区域内，并且您已在 css 中添加 #header-search {height:50px;} 错了。

解决方案： 只需在您的 css 文件中添加此样式（如果不起作用，请添加 !important）：

#header-search {
    height: auto;
    min-height: 50px;
}

注意：每个浏览器都使用他们的用户代理样式表来解决一些问题。

【讨论】：