Javascript 事件以删除搜索下拉列表

对于大多数开发人员来说，这可能非常明显，但我无法确定何时删除作为按键事件一部分创建的搜索下拉列表

这是我当前的脚本，我正在将名为searchDropDown的下拉列表添加到包含文本输入的现有div中。所以唯一的问题是什么时候删除Search下拉框？因为如果我删除文本输入的模糊，它将在选择任何内容之前删除下拉列表

---

将此添加到当前代码中

 $(document).on("click",".searchResultItem",function(){
$("div.searchBox input[type=text]").val($(this).html());
    $(".searchResultItem").remove();
});

---

在onBlur事件中删除它

$("div.searchBox input[type=text]").blur(function() {
    //remove Dropdown
    $("div#searchDropDown").remove();
});

使用：

而不是

$("div.searchBox").focusout(function() {

因为它是一个动态创建的元素

为什么要在移除元素之前返回

$("div.searchBox").on('focusout', function() {
        console.debug("focusout");
        //return
        if($(this).val() == ""){
            $(this).val("Enter location");
        }           
        $("div#searchDropDown").remove();       
        $(this).css("color", "gray");               
        return; // return here
    }); 

---

您可以为此创建一个JSFIDLE吗？@AnoopJoshi Fiddle链接-您必须在中的searchResultItem中隐藏onclick事件result@Jak但这将是一个问题，因为如果焦点移出搜索框，下拉列表也应该隐藏，但即使我的搜索框没有焦点，下拉列表也不会隐藏，即当搜索框不再存在时，下拉列表应该隐藏聚焦。谢谢Anup，但是你看，现在值没有加载到文本框中。不，这会产生问题，因为我无法从下拉列表中选择任何内容。Alex，你看，在这种情况下，我现在无法获取所选值。

$("div.searchBox").focusout(function() {

$("div.searchBox").on('focusout', function() {
        console.debug("focusout");
        //return
        if($(this).val() == ""){
            $(this).val("Enter location");
        }           
        $("div#searchDropDown").remove();       
        $(this).css("color", "gray");               
        return; // return here
    });