可拖动的 jquery ui 触摸防止在 Chrome 上专注于输入

问题描述

我无法点击我的输入，也无法选择，因为我使用 jquery.ui.touch-punch 脚本在触摸设备上启用 jquery UI 拖动功能。

以下是我正在使用的库：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

<script>
        $( function() {
            $( "#draggable" ).draggable({
            })
        });
</script>

在我的身体下方，我有：

<div class="block3 ui-widget-content" id="draggable">
<div class="col">
                            <select class="form-select text-uppercase">
                                <option value="" selected>P</option>
                                <option value="">G</option>
                      <option value="">M</option>
                            </select>
                        </div>
<div class="col">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Code">
                                    <span class="input-group-text"><i class="fas fa-sync"></i></span>
                                </div>
                            </div>  
                            <div class="col">
                                <div class="input-group">
                                    <input type="text" class="form-control" placeholder="Code agent">
                                    <span class="input-group-text"><i class="fas fa-info-circle"></i></span>
                                </div>
                            </div>  
</diV

任何熟悉此脚本的人都可能知道 Chrome 为什么停止选择并专注于输入？任何帮助将不胜感激

解决方法

我通过添加一些 javascript 找到了输入的解决方案

<script>
    $('form').on('touchstart','input',function(){
        $(this).focus();
    });
</script>

但我不知道如何强制选择。有什么想法吗？