從自定義函數訪問JQuery UI可拖動事件

繼承自己的自定義函數，名爲「doIt」，就像你可以看到的只是簡單地允許某人在類或者id上調用.doIt（），並且在這種情況下使背景顏色變爲紅色然後使元素可拖動。（這是我的第一次嘗試，所以請好起來）。從自定義函數訪問JQuery UI可拖動事件

(function($) { 
    $.fn.doIt = function(customOptions) { 
     var options = $.extend({}, $.fn.doIt.defaultOptions, customOptions); 
     return this.each(function() { 
     var $this = $(this); 
     $this.on('click', function(e){ 
      e.preventDefault(); 
      $this.css("background-color", options.color); 
      $this.draggable(); 
     }); 
     }); 
    }; 
    $.fn.doIt.defaultOptions = { 
    color: "#000" 
    };    
})(jQuery);

，因爲我的功能，使可拖動的元素，我想用一些綁拖動像「停止」，例如事件所以當拖動停止我希望用戶能夠訪問同一事件/ ui info停止回調。

但是，如何與我的函數中的可拖動停止事件進行交互？

什麼IM希望看到的是somethign像：

$("div#test").doIt({ 
    color: "#ffeeaa", 
    stop: function(e, ui){ 

     //interact with draggable event/ui here. 
     //So 'e' and 'ui' would return me what the 'stop' event from draggable would normall return. 

    } 
});

這是可以做到的還是我找錯了樹？

來源

2012-06-25 azzy81

你只需要將你的選項傳遞給jQuery。顯然，你正在定義的選項超出了jQuery的使用範圍，所以你可能想要過濾出那些jQuery並不在意的選項，但我相當肯定你不需要; jQuery將忽略它不使用的屬性。

因此，您正在專門嘗試掛入stop事件。要做到這一點，改變這一行：

$this.draggable();

這樣：

$this.draggable({ 
    stop: customOptions.stop // Get the callback defined in custom options 
});

如果你沒有你的自定義選項和jQuery的定義選項之間的任何命名衝突，你很可能只是做這樣的：

$this.draggable(customOptions);

jQuery將調用你的函數（傳遞event和ui參數的話），一旦用戶停止拖動可拖動ELE換貨。

來源

2012-06-25 16:34:59 RustyTheBoyRobot

謝謝。當你知道如何時，它非常容易。我的嘗試實際上已經接近這一點，但沒有達到目標。你的代碼像夢一樣工作。再次感謝^^ – azzy81

從自定義函數訪問JQuery UI可拖動事件

回答

相關問題