javascript - 为什么传单搜索框这么容易就消失了？以及如何保留它？

Question

我已经实现了 Leaflet search-box扩展名。
每当我使用鼠标在 map 上平移时，搜索框会立即消失，用户每次都必须重新输入整个查询。
我希望搜索框及其查询一直存在，直到用户按下清除按钮。
显示: block ；添加和删​​除以显示/隐藏搜索框。我只想在用户清除查询时允许折叠发生，而不是在任何鼠标移动时发生。

或者，我尝试保留查询，这样用户就不必每次都重新输入它。通过捕获折叠事件并存储查询。但此时盒子已经被清理干净，没有任何文字需要记住。

var timeout = {};
var oldQuery = "";
controlSearch.on('search:expanded', function () {
    var searchBox = this._input;
    searchBox.value = oldQuery;
    this._input.onkeyup = function () {
        clearInterval(timeout);
        timeout = setTimeout(function () {
            var query = searchBox.value;
            search(query, searchItems, searchResultsLayer);
            if (query.length > 0) {
                if (!searchResultsShown) {
                    searchResultsLayer.addTo(map);
                }
            }
            else {
                if (searchResultsShown) {
                    searchResultsLayer.removeFrom(map);
                }
            }
        }, 200);
    };
}).on('search:collapsed', function () {
    oldQuery = this._input.value;
});

Answer 1

要保留用户输入，您必须删除:

this.cancel();

来自:

collapse: function() {

}

要防止搜索框折叠，您可以将选项 collapsed 添加为 false，如下例所示:

map.addControl( new L.Control.Search({
    container: 'findbox',
    layer: markersLayer,
    initial: false,
    collapsed: false
}) );

然后，当您单击“清除”时，您应该触发折叠功能，并且一切都应该正常工作。