javascript - 哪些主题更改可能导致 BigCommerce 快速搜索无法运行？

Question

一位客户要求对他们的网站进行响应并略微更新设计，同时尽可能接近原始网站。我们在暂存站点上安装了 Classic Next(浅色)主题，并针对该效果对主题外观进行了编辑。在某些时候，快速搜索(在用户输入时以及在执行搜索之前导致建议产品立即显示在搜索框下方的功能 - 如下所示:Functioning BigCommerce quick search.)功能停止工作。我联系了 BigCommerce 支持，他们建议检查 quicksearch.js 和 search.html 文件，这两个文件都没有修改原始主题。我问是否有更熟悉 BigCommerce 主题的人有更多建议，他们告诉我去论坛。

应该触发快速搜索的 JavaScript 存在，但似乎从未被调用。我在控制台中收到几个警告 - 一个是 common.js 的“返回语句后无法访问的代码”，也没有更改，一个是“不推荐使用 getPreventDefault()。改用 defaultPrevented。”对于 jQuery - 但是，据我所知，两者都不应该阻止快速搜索的工作。调试器显示正在加载 quicksearch.js。

出现此问题的站点是 https://www.brace-mart.com/ .

阻止快速搜索工作的主题有什么问题？小麦文件会导致这样的问题吗？

非常感谢您的帮助!!!

Answer 1

原来主题有一个 %%Panel.DrawerMenu%% 片段，它似乎在网站上没有做任何事情——除了破坏快速搜索。我们从 56 个文件中删除了该片段，快速搜索开始起作用。

编辑: 感谢@tim-diztinct 的通知，我们将抽屉菜单放回原处。查看抽屉菜单的代码并尝试，我们最终从抽屉菜单中删除了搜索栏。所以

<div id="DrawerMenu">
<div class="inner">
    <div class="drawer-search">
        %%Panel.HeaderSearch%%
    </div>
    %%Panel.SideCategoryList%%
    %%Panel.SideShopByBrand%%
    %%Panel.SideCategoryShopByPrice%%
    %%Panel.SideAdditionalInformation%%
    %%Panel.SideAccountNavigation%%
</div>
</div>

成为

<div id="DrawerMenu">
<div class="inner">
    %%Panel.SideCategoryList%%
    %%Panel.SideShopByBrand%%
    %%Panel.SideCategoryShopByPrice%%
    %%Panel.SideAdditionalInformation%%
    %%Panel.SideAccountNavigation%%
</div>
</div>

一旦我们从抽屉菜单中删除搜索栏，主菜单中的快速搜索就可以使用了!我们将主搜索栏修改为始终在标题中可见，因为无论如何我们都希望它出现。

我的理论是，因为页面在主菜单之前加载抽屉菜单，并且在我们从抽屉菜单中删除搜索栏之前，快速搜索在抽屉菜单中工作，而不是在主菜单中工作，所以快速搜索是仅应用于页面上的第一个搜索栏，并且有某种(可能与主题相关的)错误阻止其应用于第二个搜索栏。但这只是一个理论。 . .