問題タブ [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 に答える
991 参照

jquery-ui - jQuery - 複数の重複する Droppables により、予期しないドロップが発生する

重なっているドロップ可能オブジェクトのアイソメ グリッドにドロップされているドラッグ可能オブジェクトがあります。ドロップ可能なものは灰色のタイル、img タグで、最初に添付された画像のように見えます。ドラッグ可能なオブジェクトがその上にある場合、それらは青色で強調表示されるように設定されています。

ドロップ可能なソースコードは次のとおりです。

基本的には、a) 一度に 1 つのタイルを強調表示し、b) 強調表示されたタイルをオブジェクトがドロップされたものにしたいと考えています。

私はあらゆる種類の寛容を試みましたが、役に立ちませんでした。

画像:

i.imgur.com/dGx9X.png

i.imgur.com/vb1d9.png

0 投票する
4 に答える
11884 参照

jquery - FullCalendar:ドロップ関数でイベント終了を設定します

外部イベントをカレンダーにドラッグアンドドロップする機能があります。開始時刻のデフォルトの動作は、イベントがドロップされた場所です。デフォルトの動作を設定して、イベントの終了時刻も開始時刻の1時間後に設定したいと思います。これは些細なことのようですが、私はそれを機能させることができないようです。以下は私のドロップ機能です(基本的にドロップ可能なアイテムのデモに1行を加えたものです)。

何か案は?

ありがとう、ジョー・チン

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

javascript - jQueryUI のドラッグ可能な奇妙なバグ

jQueryUI draggable にバグが見つかりました....こちらのデモページで確認してください

ページが下にスクロールするほどオブジェクトを下にドラッグすると、ドラッグ可能なオブジェクトはカーソルに対する位置を失います。

バグの原因とそれを修正する方法はありますか?

ありがとう :)

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

jquery - jquery ドラッグ可能/ドロップ可能

以下の点についてご協力いただければ幸いです。ドロップ可能なボックスの外に写真が必要です。ユーザーは画像をボックスにドラッグできる必要があり、画像がボックス内に入ると、ユーザーは引き続き画像をドラッグできる必要がありますが、ボックス内のみです。

ご指摘ありがとうございます。

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

jquery - ドラッグ可能、ドロップ可能、ソート可能

私はJQueryを初めて使用します。最近、プロジェクトに取り組んでいて、次の問題に直面しました。

私は2つのulを持っています(たとえば、gallery(LHS)とtrash(RHS))。

ギャラリーには8つのliがあり、ドラッグして並べ替えることができます。liをゴミ箱にドラッグアンドドロップできます。ゴミ箱に捨てることもできます。

私が直面している問題は、このliの配置にあります。実際、最初はゴミ箱は空ですが、8つの長方形のボックスを含む背景画像があり、各長方形のボックスにはシリアル番号が含まれています(注意してください。8つの長方形のボックスは単に単一の画像)。

したがって、最初のliをゴミ箱にドロップすると、最初の長方形のボックスがliの後ろに隠れます。2つ目をドロップすると、2つ目のボックスが非表示になります。

ギャラリーから最初のliを8番目のrectにドラッグするときにそれが必要です。ゴミ箱は1​​つの容器なので、上に移動するのではなく、そこにとどまります。

誰かが私に8つの異なるコンテナを使用するように提案しました。しかし、問題は、この8つのコンテナーをソート可能にできるかどうかです。特定のコンテナーにドラッグ可能、ドロップ可能、およびその8つのコンテナー内にソート可能なliが必要です。

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

jquery - Jquery:MouseOverでのDroppableの最適化

JqueryのDraggable/Droppable機能を使用して、TreeViewから単純なHTMLテーブルへのドラッグアンドドロップを可能にしていますが、テーブル内のセルの数が増えると、Droppableのパフォーマンスが非常に遅くなることがわかりました。

私は周りを見回しましたが、人々が提案する最も一般的な解決策は、アクティブなドラッグ可能オブジェクトとドロップ可能オブジェクトの数を制限することです。これで、ドラッグ可能なものを制限するのは簡単でした(ツリービューノードのマウスオーバーを使用してドラッグを有効にします)。

次に、ドロップ可能に対して同じことを実行しようとしました(つまり、ユーザーがセルをマウスオーバーしたときにのみセルをドロップ可能にします)が、タイミングの問題が発生しました。

基本的に何が起こるかというと、ユーザーはノードをセル上にドラッグし、ドロップすることはできません。しかし、それからもう一度それをやろうとすると、それはうまくいきます!つまり、マウスオーバーイベントは機能する前に完了する必要がありますが、「完了する」とは、最初のドラッグアンドドロップを停止することを意味し、明らかに理想からはほど遠いものです。

これは私が使用しているコードです:

そして明らかに、addCell()は、動的に(ページのロード時またはテーブルのサイズ変更時に)テーブルに追加される新しいセルごとに呼び出されます。

これを回避する方法はありますか?Javascriptに「beginmouseover」イベントのようなものがあれば、これははるかに簡単です...

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

javascript - jqueryを使用してドラッグ可能なアイテムを最初の位置に戻す方法

として配置された一連の画像がありますposition:relative(隣り合って表示されます)。

このコードを使用してドラッグ アンド ドロップします (jQuery API ドキュメントから盗み、必要に応じて変更しました)。

私がやろうとしているのは、ユーザーがドロップした後、ドラッグ可能な要素を初期位置に戻すことです。ただし、私の要素は最初の左に相対的に配置されているため、上の座標はすべて同じです (または、これはドキュメントから理解していることです。ここで間違っている可能性があります)。そのため、画像は返されますが、実際にはそれぞれが他の画像の上に積み重ねられます。

私は何を間違っていますか?私はどうしたらいいですか?

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

jquery - Windows Explorer のようなウィンドウを作成するための選択およびドラッグ可能な jQuery

私は今、どうすればいいのか分からない別のことに直面しています。

私はjQueryが初めてで、アイコンをドラッグ可能にしようとしています。フォルダー(.folder div)にドロップすると、そこに移動します。

  1. アイコンをドラッグします (ドラッグする方法は知っていますが、Web ページ全体ではなく、親 div にのみ表示されます)。
  2. #navbar (左側) のフォルダーにドロップします (繰り返しますが、特定の div にドロップできるようにする方法がわかりません)。
  3. 元のコンテンツで移動した div を削除し、他のすべての div を再配置します
  4. PHP ページを呼び出して、この div に関連付けられたファイルを選択したディレクトリに移動します

ページの中央にある div (ドラッグ可能にしたい) はアイコンです。それらをドラッグして左側のフォルダーにドロップすると、そこに移動します。

ここで、それがどのように見えるかを見ることができます (Firefox を使用した方が良い) : http://narks.xtreemhost.com/

これは、お見せするためのテストページです。誰でも私を助けてくれますか?

Web ページの構造を知るには、CSS レイアウトの Windows 7 エクスプローラーを参照してください(Ivan Ivanić の貴重な助けに感謝します1)。

EDIT jQuery ドラッグ & ドロップ:

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

jquery - スライドする div によってブロックされたドロップ イベント?

ドラッグの開始時に表示されるスライド パネルに要素をドロップしようとすると、問題が発生します。そして、最初のドロップは機能しません。アイテムを 2 回ドロップする必要があります。これは起こるべきではありません。

また、ユーザーが別の画像をドラッグ アンド ドロップできるように、パネルを 3 秒間表示したままにしておきたいのですが、代わりにそこに置いたままにして、再び上下にスライドさせます。それを回避することは可能ですか?または、別のドロップで遅延をリセットしますか? つまり、別の要素がドロップされた場合、遅延が再開されます。

そして、$('.last.thumb').replaceWith($(ui.draggable).clone());うまく機能していません。これにより、最後に追加された画像が表示されます。

作業例はこちら

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

jquery - Draggables Jquery UI、droppable で個々の div を無効にする

私はいくつかの教育サイトを作成しようとしていますが、次の段階に進む前に、生徒にアイテムを領域にドラッグしてもらいたいと考えています。

これを行う方法は、jquery droppables スクリプトを使用し、ドロップ可能な div にドロップされたときにアイテムのドラッグ可能なオプションを無効にすることでした。次に、変数に 1 を追加しようとしました。正しい数値になると、進むボタンが有効になります。

問題は、ドロップ可能な機能を特定のドラッグ可能なものごとにのみ機能させる方法がわからないことです。だから私が持っているものは次のとおりです:

これらのdivで;

しかしもちろん、これが行うことは、ドロップ可能な div にドラッグされるたびに、最初のドラッグ可能なものを無効にすることだけです。私のjavascriptはあまり良くありません(学習中です)。ドロップ可能な領域に入れたものだけを無効にする方法がわかりません。

誰でも助けてもらえますか?