OpenCart 2.3.0.2移动端输入框键盘弹出后立即关闭问题

你遇到的问题根源是：移动端键盘弹出时会触发window.resize事件，而你的代码每次resize都会重新执行元素移动逻辑——把购物车区域从原位置移除再插入到新位置。这个DOM操作会导致当前获得焦点的输入框失去焦点，键盘也就随之关闭了。

修改代码，添加防抖机制，并且只在窗口宽度发生显著变化时才执行元素移动，避免键盘弹出这类非屏幕尺寸变化的resize触发DOM操作：

<script>
    $(function(){
        let lastWindowWidth = $(window).width();
        // 防抖定时器
        let resizeTimer;

        function moveCart(){
            const currentWidth = $(window).width();
            // 只有宽度变化超过10px时才执行，过滤键盘弹出的微小变化
            if(Math.abs(currentWidth - lastWindowWidth) < 10) return;
            
            lastWindowWidth = currentWidth;

            if(currentWidth < 768 ){
                const $cartArea = $('#content > .row > .col-sm-4');
                // 避免重复执行移动
                if(!$cartArea.hasClass('moved-div')){
                    $cartArea.removeClass('col-sm-4').addClass('moved-div');
                    $('.moved-div').insertAfter('.thumbnails');
                }
            } else {
                const $movedDiv = $('.moved-div');
                if($movedDiv.length){
                    $movedDiv.insertAfter('#content > .row > .col-sm-8').addClass('col-sm-4').removeClass('moved-div');
                }
            }
        }

        // 初始化执行
        moveCart();

        $(window).resize(function(){
            // 防抖：300ms内只执行一次，避免频繁触发
            clearTimeout(resizeTimer);
            resizeTimer = setTimeout(moveCart, 300);
        })
    });
</script>

• 防抖机制：添加300ms的定时器，避免窗口resize时频繁触发DOM操作，提升性能同时减少不必要的元素移动。
• 宽度变化阈值判断：记录上次窗口宽度，只有当宽度变化超过10px时才执行移动逻辑，过滤键盘弹出导致的微小视口变化。
• 重复操作判断：添加类名判断，避免在已经处于正确位置时重复执行移除/插入DOM的操作，防止焦点丢失。

内容的提问来源于stack exchange，提问作者bifflowman