2011-12-10 12 views
0

現在、ドラッグ&ドロッププラグインを作成中です。私は、ユーザーがドラッグ可能なオブジェクトをドラッグアンドドロップできる時間を制限できるように、機能を追加したいと思います。私は、この機能、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です。これはドラッグ&ドロップアイテム/オブジェクトをドロップできる時間を取得する(マウスアップ)ためです。

例:

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

これは#dragをドラッグして20回をドロップすることができるようになるだろう。

私は多くのコードを取得しましたが、ドラッグする要素の停止方法はわかりません。

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

したがって、ユーザーは残りのページを引き続き使用できます。ストップドラッグのコードがあるべき場所ここ

は次のとおりです。

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

私は本当に誰かが私を与えた細部で私を助けることができると思います。 ありがとうございました。

答えて

1
(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には0のdragCountが与えられます(後で1に変更されます)。制限が有効な番号でない場合、プラグインのデータに格納されているプラ​​グインのデフォルトの制限がロードされます。

this.dataを使用しましたが、後で$.dataを使用しました。 this.dataを使用する場合、この情報は特定の要素に格納されます。 $.dataを使用すると、プラグイン自体のデータが読み込まれます。特定の要素に関する情報を格納するのにthis.dataを使用するので、同じ制限をすべて共有するのではなく、異なるドラッグの制限を異なる要素に簡単に格納することができます。この概要に従えば、何の問題もないはずです。

注:私はこのスクリプトをテストしませんでした。それは単なる基本的な考えです。


更新:より良い理解のためのコードを追加しましたコメント。

+0

このコードを追加するとき。それは動作するはずですか?そして私は完全なプラグインを次のようなコメントタグの場所に置きます:ここにコードを続けます。 – Shawn31313

+0

これは難しいかもしれません。なぜなら、オプションとすべてを追加する必要があるからです。 – Shawn31313

+0

上記のレイアウトで作業するには、コードを修正する必要があります。物事を貼り付けて動作させることはできません。あなたが待っているなら、私はJSFiddleの例へのリンクを投稿します。 – Mikett

-1

あなたは、必ずしもあなただけ/ためにドラッグをコードをラップ制限が満たされているかどうかをチェックすること場合に機能を落とす必要があり、ドラッグ/ドロップ機能を停止するために、任意のコードを必要としません。それがあれば、ドラッグ/ドロップコードは実行されません。

+0

私はこれをやっていると思ったが、私はしなかった – Shawn31313

関連する問題