首页 > 解决方案 > 我有这样的代码:下拉按钮需要获取我在输入文本字段中输入的数据

问题描述

我已经为我的网站实现了自动完成搜索栏。在单击下拉按钮输入文本字段时会出现,在输入文本字段中我可以输入我的位置。输入我的位置后,我的下拉菜单应该反映我在输入文本中输入的数据字段..但不是我的下拉按钮再次显示选择位置。设置位置

            <input type="search" class="form-control" id='locName' placeholder="Search Location" style=margin-top:-60px>
        </form>

    </div>
</div>
<!--JavaScript Part-->
<!--AutoComplete Search bar-->
$(function() {
    $("#locName").autocomplete({
        source: [
            "Adugodi",
            "Arekere",
            "Attiguppe",
            "Yelahanka"

        ],
        minLength: 1,
        function(event) {
            var value = event.getAttribute('value')
            var locName = document.getElementById("locName").value;
            if (value.includes('&')) {
                value = value.replace("&", "%26");
            }
            if (locName == "") {
                alert("Please Select your Location");
            } else {
                window.location = "http://www.example.com";
            }
            return false;
        }

    });
}); 

标签: htmlcss

解决方案


在这种情况下,一个可能的解决方案是从 :active 和 :focus 的 div 中删除轮廓和边框,如下所示:

.btn:focus, .btn:active {
  border: 0;
  transition: none;
  border-style: none;
  outline: none;
}

推荐阅读