Javascript jquery输入字段focusout div

在下面的脚本中： 我正在创建一个选择选项的滴状列表

但是，如果在我选择的文本val事件之后对文本id使用

focusout

事件，则该事件不起作用

有其他解决办法吗

块注释中的focusout事件

$（文档）.ready（函数（）{
//液滴开关
$（'#text'）。单击（函数（）{
$（'.droplist'）.toggle（）；
});
//文本移动到输入字段
$（'.droplist p'）。单击（函数（）{
所选变量=$（this）.text（）；
$（'#text'）.val（选中，$（'.droplist'）.hide（））；
});
//输入字段foucsout
/*$（'#text'）.focusout（函数（）{
$（'.droplist'）.hide（）；
});*/
});
#文本{
宽度：200px；
高度：35px；
左侧填充：10px；
框大小：边框框；
利润底部：3倍；
}
滴水器{
宽度：200px；
背景色：#D8D8D8；
边界半径：4px；
填充物：5px；
位置：绝对位置；
框大小：边框框；
字体系列：arial；
字体大小：15px；
显示：无；
}

选择一

选择二

选择三

选择四

选择五

仅使用
.val（）
设置值。然后隐藏列表

$("#text").val(selected);
$(".droplist").hide();

参考：
您应该为下拉列表使用适当的标记

<select class="droplist" name="droplist" id="droplist">
    <option>option one</option>
    <option>option two</option>
    <option>option three</option>
    <option>option four</option>
    <option>option five</option>
</select>


选择一
选择二
选择三
选择四
选择五
您可以使用setTimeout（）函数，因为javaScript作为“执行de$”（'.droplist p'）的一部分


$（文档）.ready（函数（）{
//液滴开关
$（'#text'）。焦点（函数（事件）{
event.stopPropagation（）；
$（'.droplist'）.toggle（）；
});
//文本移动到输入字段
$（'.droplist p'）。单击（函数（）{
所选变量=$（this）.text（）；
$（'#text'）.val（选中，$（'.droplist'）.hide（））；
});
//输入字段foucsout
$（'#text'）.focusout（函数（）{
setTimeout（函数（）{
$（'.droplist'）.hide（）；
}, 100);
});
});
#文本{
宽度：200px；
高度：35px；
左侧填充：10px；
框大小：边框框；
利润底部：3倍；
}
滴水器{
宽度：200px；
背景色：#D8D8D8；
边界半径：4px；
填充物：5px；
位置：绝对位置；
框大小：边框框；
字体系列：arial；
字体大小：15px；
显示：无；
}

选择一

选择二

选择三

选择四

选择五

我的第一个问题是。。。为什么？首先，带有P元素的div应该是一个列表（ul和li），或者更好的是一个select。正确创建表单，并使用jQuery UI创建可设置样式的下拉列表。不能对正确的下拉列表选择选项进行更多设置。