Javascript显示隐藏下拉列表不'；工作不好

我有自定义的show hide下拉菜单，我想要的是，如果我单击按钮，就会显示选项列表，当我单击outside div或再次单击按钮时，列表就会隐藏

我的问题是，当我单击按钮显示列表，然后在div外部单击以关闭它时，只有单击两次列表才会再次显示（而不是通常的单击一次）

$（文档）.ready（函数（e）{
$（'.option_down'）.hide（）；
var state=“”；
$（'.选择“向下”）。单击（函数（e）{
//隐藏所有跨度
var$this=$（'#options'+$（this.attr（'target'））；
$（“.option_down”）.not（$this.hide（）；
//这是我想做的
if（state=='#options'+$（this.attr（'target'））{
$this.hide（）；
state=“”；
}否则{
$this.show（）；
state='#options'+$（this.attr（'target'）；
}
e、 预防默认值（）；
});
//我已经准备好了
$（'.option_item_gender'）。在（'click'，函数（）{
text性别=$（'#性别'+$（this.attr（'optionEnder'））.text（）；
$（“选择性别”）.val（文本性别）；
$（'.option_down'）.hide（）；
//我们的目标是让所有人都知道
state=“”；
});
$（'.option\u item\u city'）。在（'click'，函数（）{
textCity=$（'#city'+$（this.attr（'optionCity'））.text（）；
$（“选择城市”）.val（文本城市）；
$（'.option_down'）.hide（）；
state=“”；
});
});
$（文档）.mouseup（函数（e）{
var container=新数组（）；
容器。按（$（'.option_down'）；
$.each（容器、函数（键、值）{
if（！$（value）.is（e.target）和&$（value）.has（e.target）.length==0）{
$（value.hide（）；
}
});
});


马朗
登巴萨
泗水
雅加达
日惹

有很多方法可以用更少的代码实现同样的效果，但为了满足于解决问题，您只需在
$（value）.hide（）之后重置
状态变量即可
然后将整个
$（document）.mouseup（）
事件放入
$（document）.ready（）
事件中，这样全局变量
状态
对
mouseup
事件仍然可用

请参阅。
“然后单击外部，然后我想再次显示它需要单击两次”这句话非常令人困惑。你想实现什么？mouseup代码非常奇怪。