jQuery的可拖動/ CONTENTEDITABLE代碼不正確響應

我擡起頭，從另一個帖子此代碼：jQuery的可拖動/ CONTENTEDITABLE代碼不正確響應

<div id="d" contenteditable="true"> 
    Text to edit 
</div> 

<script> 
$("#d") 
    .draggable() 
    .click(function(){ 
     $(this).draggable("option", "disabled", true); 
    }) 
    .blur(function(){ 
     $(this).draggable('option', 'disabled', false); 
    }); 
</script>

鏈接是這樣的： http://jsfiddle.net/UH9UE/222/

的問題是，當jQuery的版本是1.7，對象的突出顯示和「可選擇性」是平滑的。但是當它切換到2.0.2時，它的功能不一樣。我爲我的項目使用了更高版本，這就是爲什麼我無法回滾到舊版本的原因。

來源

2014-02-27 Earl Bunao

在您的演示中，jQuery 2.x對我很好。你的問題到底是什麼？ – Askanison4

當我選擇要編輯文本的對象時，背景會發生變化 - 灰色，就像它被禁用一樣。還有一件事，我不能輕鬆選擇對象並取消選擇它（即有時保持灰色）。 –

有一種方法可以實現這與CSS。在JavaScript

$.fn.drags = function(opt) { 
    opt = $.extend({handle:"",cursor:""}, opt); 

    if(opt.handle === "") { 
     var $el = this; 
    } else { 
     var $el = this.find(opt.handle); 
    } 
    return $el.css('cursor', opt.cursor).on("mousedown", function(e) { 
     if(opt.handle === "") { 
      var $drag = $(this).addClass('draggable'); 
     } else { 
      var $drag = $(this).addClass('active-handle').parent().addClass('draggable'); 
     } 
     var z_idx = $drag.css('z-index'), 
      drg_h = $drag.outerHeight(), 
      drg_w = $drag.outerWidth(), 
      pos_y = $drag.offset().top + drg_h - e.pageY, 
      pos_x = $drag.offset().left + drg_w - e.pageX; 
     $drag.css('z-index', 1000).parents().on("mousemove", function(e) { 
      $('.draggable').offset({ 
       top:e.pageY + pos_y - drg_h, 
       left:e.pageX + pos_x - drg_w 
      }).on("mouseup", function() { 
       $(this).removeClass('draggable').css('z-index', z_idx); 
      }); 
     }); 
     //e.preventDefault(); // uncomment to avoid making editable 
    }).on("mouseup", function() { 
     if(opt.handle === "") { 
      $(this).removeClass('draggable'); 
     } else { 
      $(this).removeClass('active-handle').parent().removeClass('draggable'); 
     } 
    }); 

}

添加此功能，只需使用該

$("#d").drags();

JSFiddle

從製造原始代碼進行一些修改發現here根據自己的需要調用它。

來源

2014-02-27 17:59:06 Derek

jQuery的可拖動/ CONTENTEDITABLE代碼不正確響應

回答

相關問題