停止拖動可拖動對象

我目前正在處理拖放插件。我想添加一個功能，以便用戶可以限制可拖動對象可以被拖放的次數。我將稱之爲dragLimitation。停止拖動可拖動對象

這是我到目前爲止有：

var limit = 0; 
       $(document).ready(function() { 
        $(oj).mouseup(function() { 
         if (o.dragLimitation !== false) { 
          if (limit > (o.dragLimitation-1)) { 
          //Code to Stop Drag Here 
          } else { 
           limit++; 
           $('#back').html(limit); 
          } 
         } 

        }); 
       });

關於代碼：有幾件事情我想清楚你們這樣我就可以得到答案。

var，oj：$(oj).mouseup(function() {只是指this。在這種情況下，this將是：$('#drag').jDrag();，這只是讓我的插件運行。

#drag = this

有一件事我想指出的是o.dragLimitation。這是爲了獲得拖放項目/對象可以被刪除的次數（mouseup）。

例子：

$('#drag').jDrag({ 
dragLimitation: 20 
});

這將使#drag能夠被拖拽20倍。

我得到了很多的代碼，但我不知道如何阻止元素拖動。我不打破代碼使用：

$('body').append('<span>');

因此，用戶仍然可以使用頁面的其餘部分。

這裏是爲停止拖動的代碼應該是：

if (limit > (o.dragLimitation - 1)) { 
    //Code to Stop Drag Here 
}

我真的希望有人能幫助我，我給的細節。感謝您的幫助。

來源

2011-12-10 Shawn31313

(function($) { 
    $.extend($.fn, { 
    jDrag: function() { 
     var dragCount = this.data("jDrag.dragCount"), 
      limitation = this.data("jDrag.limitation"); 

     if(typeof dragCount !== "number" || !isFinite(dragCount)) 
      { 
      /* 
      * Drag count isn't a valid number. 
      * Give it a 0 value, and save it to the target. 
      */ 

      dragCount = 0; 
      this.data("jDrag.dragCount", dragCount); 
      } 

     if(typeof limiation !== "number" || !isFinite(limitation)) 
      { 
      /* 
      * Limitation isn't a valid number. 
      * Load default limitation from plugin defaults. 
      */ 

      limitation = $.data("jDrag.defaults").limitation; 
      } 

     if(dragCount <= limitation) 
      { 
      /* 
      * Drag limitation isn't yet exceeded, increment count 
      * and save it to the target. 
      */ 

      this.data("jDrag.dragCount", ++dragCount); 

      /* Continue code here. */ 
      } 
    } 
    }); 
})(jQuery);

請參考jQuery.data內部存儲插件數據的方法。正如你可能看到的，上面的代碼只是加載了目標被拖動的次數，以及對目標的限制。如果dragCount不是有效的數字，則會給它一個零的dragCount（後來更改爲1）。如果限制不是有效的數字，它將加載存儲在插件數據中的插件的默認限制。

請注意，我們使用了this.data，但我們後來使用$.data。當使用this.data時，該信息存儲在特定元素上。使用$.data將爲插件本身加載數據。由於我們使用this.data來存儲關於特定元素的信息，因此您可以輕鬆地在不同元素上存儲不同的拖動限制，而不是使它們都具有相同的限制。如果你遵循這個大綱，你不應該有任何問題。

注：我沒有測試這個腳本。這只是一個基本的想法。

更新：添加了註釋，以便更好地理解編碼。

來源

2011-12-10 18:20:54 Mikett

所以當添加此代碼。它應該工作？我把我的完整插件放在評論標籤的地方，說：繼續代碼在這裏。 – Shawn31313

這可能會很困難，因爲我必須添加選項和所有內容 – Shawn31313

您必須調整代碼才能使用上面的佈局。你不能只將東西粘貼到位，並期望它們工作。如果您等待，我會發佈一個JSFiddle示例的鏈接。 – Mikett

-1

你不一定需要任何代碼停止拖/放功能，您應該只是包裝的代碼爲拖/在如果來檢查，如果限制已經達到拖放功能。如果它有拖動/拖放代碼不會執行。

來源

2011-12-10 17:18:43 anson

我想這樣做，但我不想 – Shawn31313

停止拖動可拖動對象

回答

相關問題