問題タブ [jquery-droppable]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
1 に答える
632 参照

jquery-ui - jquery droppable-ネストされたdiv、ターゲットIDを取得

私はこのようなものを持っています:

それから

ムーバーをdivにドロップすると、「コンテナ」が返されます。代わりに、アイテムがドロップされた最も低い子を返すにはどうすればよいですか?

0 投票する
2 に答える
86 参照

javascript - ドロップ可能な関数を使用してdivを表示する

私のコードは、1つを除いて、計画どおりに機能します。濃い灰色のボックスをクリックすると、オレンジ色のボックスがshow();とともに表示されます。

ただし、青いドラッグ可能なdivをオレンジ色のボックスにドロップすると、紫色のボックスが表示されるようにします。これはうまくいかないようです。

あなたへの私の質問は、それが数行上で機能するのに、なぜこれがドロップ関数で機能しないのか、そしてどうすればこれを機能させることができますか?

紫色のdivをオレンジ色のdivの中に配置しようとしましたが、表示されるのは1回だけです...助けていただければ幸いです。理解できない場合はお知らせください。

JsFiddle(問題はドロップ可能な関数にあります)

jQuery

HTML

0 投票する
0 に答える
158 参照

jquery-ui - jqueryレイアウトを動的に作成するには?

jquery レイアウト プラグインを使用しており、画像をドラッグして jquery レイアウトのセクションにドロップすると、ネストされたレイアウトが作成されます。最初は正常に動作しますが、2 回目は動作しません。

画像のドロップ機能で次のコードを使用しています - $("#mainContent").empty(); $("#mainContent").layout(DashboardGenerator.layoutSettings_Inner);

0 投票する
2 に答える
825 参照

backbone.js - jQueryとバックボーン:特定の条件下で、ドロップイベントにビューを追加する方法

次のCanvasModelのビューがあり、ユーザーはツールバーからさまざまなウィジェットをドラッグアンドドロップできます。CanvasViewに何かがドロップされるたびに、新しいWidgetViewインスタンスがDOMに追加されます。

最近追加されたウィジェットもドラッグ可能で、ユーザーはキャンバス内の好きな場所にウィジェットを配置できます。問題は、最近追加されたWidgetがドロップされるとすぐに、別のWidgetViewインスタンスが追加されることです。

ツールバーからキャンバスにドラッグされたウィジェットのみをインスタンス化したい(それらには「ドラッグされた」クラスがあります)。ドロップリスナーを「フィルタリング」する方法はありますか?CanvasViewは、ドロップされたアイテムに「ドラッグ」のクラスがあるか、ツールバーからドラッグされた場合にのみウィジェットをインスタンス化しますか?

0 投票する
1 に答える
2957 参照

jquery - jquery uiは、モーダルのキャンセル時にドロップされたドラッグ可能を元に戻します

管理システムファイルでjqueryドラッグ可能なファイルをアクティブにするこのコードがあります.キャンセルをクリックすると確認ダイアログがポップアップし、ドラッグ可能なファイルは自動的に元に戻ります.誰か助けてもらえますか?

0 投票する
2 に答える
1251 参照

jquery - Magento でドラッグ & ドロップを使用してカートに商品を追加する

ドラッグ&ドロップで商品をカートに入れたい。そのために、jQuery UI Droppable を使用しています。コードは:-

});

このコードを使用すると、製品名がカートにドロップ可能になりますが、カートには追加されません。商品名をカートに入れようとしても入れません。私を助けてください。

0 投票する
1 に答える
162 参照

jquery - ドラッグ可能 1 つ、ドロップ可能 2 つ (1 つはソート可能)

ここやウェブ上の他の場所で大量の投稿を読みましたが、自分の状況に適した解決策を見つけることができません。

ドロップ可能として設定されている 2 つの div があります。#imgBrowser には、AJAX を介して動的に読み込まれる一連の画像が含まれています。その AJAX 呼び出しが戻ると、画像をドラッグ可能として設定し、2 つの div (#imgBrowser と #imgQueue) をドロップ可能として設定し、#imgQueue もソート可能として設定する関数を起動します。

ユーザーは、2 つの div 間で画像を前後にドラッグできます。私はこれを完璧に機能させています。しかし、私が追加したい機能は、#imgQueue もソート可能にすることです。

これまでの私のコードは次のとおりです。

2 つのサポート機能:

そして単純なhtml:

私が抱えている問題は、#imgQueue をソートしようとすると、ドラッグ可能/ドロップ可能がソート可能をオーバーライドすることです。ソート可能なものがドラッグ可能なものをオーバーライドしていたとしたら、#imgBrowser にドラッグして戻したい場合は問題になると思います。私がやろうとしていることは可能ですか?

ありがとう!マット

0 投票する
0 に答える
2764 参照

jquery - iframe 内の要素のみをドロップします。それ以外の場合は元に戻します

編集:1

これは drag.html (メイン ページ) です -

そして、これは iframe コードです -

ここで行ったように、iframe がなくても簡単に達成できることはわかっています が、現在のプロジェクトでは、iframe を排除することはできません。だから、私を助けてください。

ここでデモをチェック

赤いボックスは iframe 内にあり、要素を赤いボックスのすぐ内側にドラッグ アンド ドロップすると正常に動作しますが、ボックスの下部にドロップすると元に戻ります。

また、iframe の近く (iframe のすぐ上) にドラッグボックスをドロップすると、正常にドロップされます。

私が望むのは、赤いボックスの内側が元に戻る場合にのみ、ドラッグボックスをドロップすることです。

これをチェック

iframe を使用する場合、ドロップ可能領域に問題がありますが、解決策が見つかりません。

前もって感謝します!

0 投票する
1 に答える
329 参照

jquery - jQuery UI 要素で繰り返しドラッグすると失敗する

非常に複雑なショッピング カートに、単純なドラッグ アンド ドロップの基盤を用意しようとしています。jQuery UI を使用したことがないため、主な概念を示すプロトタイプを作成しました。

つまり、カートには、ドラッグ可能なアセットをいくつでも含めることができるコンテナがいくつかあります。それはdiv内のdivです。アセットは、任意のコンテナーにドロップできるようにする必要があります。最初のインタラクションは機能していますが、アセットを別のコンテナーにドロップした後、同じアセットをドラッグして戻すか、別のコンテナーにドラッグしようとすると、ドロップは機能しますが、ドラッグはカーソルに追従しません。

ここにコードを投稿しました:http://jsfiddle.net/VjWx2/

ここに私のJavaScriptがあります:

0 投票する
1 に答える
5050 参照

jquery - 項目を div にドラッグ アンド ドロップし、元の位置に戻すオプションがあります

説明したように、私が持っているメニューの種類からいくつかの div をドラッグし、それらを特定の div にドロップできるようにしたい.

http://jsfiddle.net/bysnc/

ただし、それぞれに「x」ボタンを追加して、「x」ボタンをクリックすると、ドラッグ可能/ドロップ可能な要素が元の位置に戻る(元に戻る)ようにしたい..

私はこれを見つけた

http://jsfiddle.net/v7n6w/

これは私が望んでいたもののように思えました(実際には、全体的なものではなく、それぞれに固有のボタンが必要です..しかし、1)これはjsfiddleでもドロップされないようです2)私のテストでは、コンソールにエラーが表示されます"Uncaught TypeError: 未定義のプロパティ 'originalPosition' を読み取ることができません"

具体的には、この行でエラーが発生します ui.draggable.data("draggable").originalPosition);

ここにjs部分があります..

私のhtmlは次のようになります

ドロップ可能な位置 fooにのみドロップできるようにしたい

そして初期位置

psプラグインjquery.uiではなく、jqueryだけでこれをダウンさせることができますか?