失去了重點ContentEditable DIV？

Question

我有一個可編輯的div：

<div id="editor" contentEditable="true"> Enter your text here.. </div> 

我想，當我選擇在下拉組件的一些元素來改變字體爲可編輯的div選定的文本，但每次我在下拉單擊一個項目組件，我放鬆了可編輯的div。

我已經搜索了這個問題，但是我找不到任何可以理解的東西。

在這篇文章：dont-lose-focus-when-clicking-another-element，我發現這個代碼：

protect: function (e) { 
     e.preventDefault() 
     return setTimeout(300) 
    } 

但我不知道如何將它添加到我的代碼。

如果有人可以幫我解決這個問題，我會很樂觀。

Answer 1

基本上你只需要

1. 停止從鼠標按下了那個小保護功能的情況下，你有

2. 但仍然處理您的點擊事件。

   heres the example, focus on the input first than you click hi 
   
   var protect = function (e) { 
       e.preventDefault() 
       return setTimeout(300) 
   } 
   
   var handleClick = function(){ 
       alert('hi') 
   } 
   
   $('div') 
       .on('mousedown', protect) 
       .on('click', handleClick) 
   }) 
   

這是怎麼你做假設你正在使用jQuery http://jsfiddle.net/yF6Gg/