如何管理＆＃34;点击＆＃34;之间的事件冲突和＆＃34;模糊＆＃34;

Question

我目前正在处理带有值提案的输入文本，这是html：

<div>
   <input type="text"/>
   <ul>
      <li>Value 1</li>
      <li>Value 2</li>
      <li>Value 3</li>
   </ul>
</div>

使用jQuery我绑定了2个事件：

// On click on proposal, change the input value
$('li').click(function(){
   $('input').val($(this).text());
}); 

// On input blur, close proposal
$('input').blur(function(){
   $('ul').hide();
}); 

但现在，我遇到了一个大问题。当我点击li时，第一个事件启动是输入模糊，因此ul被隐藏，并且从未调用过click事件。

我已经阅读了一些解决方案（like this one），但在我的情况下，蓝色事件会隐藏点击区域，因此无法调用我的第二个事件。

如何管理此冲突？！