Javascript 元素在键盘输入时不自觉地切换

我正在创建我的第一个“真实”网站，并尝试为我的布局和导航添加一些响应：

我对菜单项使用了许多addClass和removeClass，并根据浏览器窗口的宽度进行切换。到目前为止还不错

问题是，当我在iPhone上查看时，我的搜索字段在焦点处消失。我有一种模糊的怀疑，当我的jquery命令使它在文档宽度改变时消失时，它会发生什么。但我真的不知所措

此外，在单击菜单元素时，菜单项的切换往往会出错，即使我将它们设置为等待文档加载。有什么建议吗

$（文档）.ready（函数（）{
var$introbrowserwidth=$（window.width（）；
$soeg=$（'a.soege-knap'）；
$mobnav=$（'a.mob-nav'）；
$soegelist=$（'div#search table'）；
$searchtable=$（“#搜索表”）；
$soegefel=$（'ul.menu-item-holder>#searchfield'）；
$menuknap=$（'LIA.menu-knap'）；
$menu=$（'div.menu'）
$menulist=$（'.menu li'）
$emneoversigt=$（“#emneoversigt”）
$emneoversigtlistitem=$（“#emneoversigtli”）
$（'.mob nav'）.css（'cursor'，'pointer'）；
$temamenu=$（“#tema菜单”）；
如果（$introbrowserwidth这是搜索的div：

<div id="search-table">
            <span>
                <form id="soege_form" action="<?=$grundsti;?>sider/soegning.php" method="post">
                    <input name="portal_id" type="hidden" value="<?=$valgt_portal_id;?>" />
                    <input placeholder="Søg i alle artikler"  name="soegeterm" border="none" id="soegeterm" type="text" size="30" maxlength="100" class="loginfelter venstrefloat boxshadow"  />
                    <button id="submit"  style="cursor: pointer;" class="sendknap venstrefloat button_bg">Søg</button>
                </form>
            </span>
        </div>

这条线使它消失了：

    if ($introbrowserwidth <=480) {
            $soegelist.addClass('displaynone');
...

if（$introbrowserwidth发现输入时会影响文档的宽度，从而激活my js resize函数

奇怪的是，它只在iOS上这么做

解决方案是在条件中添加一个
！$（'input:focus'）。length
，这意味着只要有人使用任何形式的输入，就不满足切换条件

现在的问题是：如何区分想要的和不想要的文档大小调整？
是的，这会使它消失，直到你单击搜索图标，它重新出现。但是，当你开始在iPhone上键入键盘时，它怎么会消失呢？试着这样做：$soegefel.keypress（function（）{$soegefel.removeClass（'displayne'））.addClass（'displayblock'）；}）；它确实添加了该类，但在iPhone上，它仍然在键入时切换搜索输入。
$soegelist = $('div#search-table') ;

    if ($introbrowserwidth <=480) {
            $soegelist.addClass('displaynone');
...