如何使「#box」拖動只有拖動「#head」 DIV，不會使「#box」拖動時，我拖「＃內容」

Question

這是我的代碼：

<div id="box" style="border:1px solid red;height:100px;width:150px;position:relative;background:#eee"> 
     <div id="head" style="background:black">drag me</div> 
     <div id="content" contenteditable=true style="border-bottom:1px solid red;height:70px;margin-bottom:5px;"> edit it </div> 
     <input id="ok" type="button" value="ok"/> 
     <input id="cancel" type="button" value="cancel"/> 
    </div> 

和腳本是：

$('#box').draggable() 

演示是在這裏：http://jsfiddle.net/VRxZe/

感謝

Answer 1

$('#box').draggable({ 
    handle: $('#head') 
});