Wie kann ich ein Objekt in einem Kontext eines ziehbar Elements in JQuery injizieren?
-
07-07-2019 - |
Frage
Ich verwende ziehbar / abwerfbaren JQuery-Funktion wie folgt
div.container {
height:400px;
}
<div class="container" id="source">
<div id="0">Item 0</div>
<div id="1">Item 1</div>
<div id="2">Item 2</div>
</div>
<div class="container" id="target"></div>
$("#source div").draggable({
helper:"clone",
revert:"invalid"
});
Ich möchte wissen, ob möglich ist, ein Objekt in einem Kontext eines ziehbar Objekt injizieren. So etwas wie
var contextualObject = {"property":"value"};
$("#source div").draggable({
helper:"clone",
revert:"invalid",
injected:contextualObject
});
So in Zielbehälter i so etwas wie (Hinweis zweite Alarm-Anweisung) verwenden könnte
$("#target").droppable({
accept:"#source div",
tolerance: "fit",
drop:function(e, ui) {
alert("You have dropped id " + $(this).attr("id"));
alert("Its contextual value is: " + $(this).draggable("option", "injected.property"));
}});
Wie kann ich es tun?
Grüße,
Lösung
jQuery Daten ist für diese Art der Sache gemacht.
$("#source div").draggable({
helper:"clone",
revert:"invalid",
start: function(evt,ui) {
$(this).data('injected', contextualObject)
}
});
Dann in Ihrem abwerfbaren:
var obj = $(ui.draggable).data('injected');
console.log(obj.property);
Ein paar Anmerkungen:
- Sie sollten
ui.draggable
in Ihrem Drop verwenden, um das Einzelteil zu erhalten, die Drag-and-Drop.this
Der Artikel ist über abgesenkte immer - Element-IDs sollten beginnen mit einem Buchstaben , nicht eine Zahl.
Ich habe eine funktionierende Demo hier .
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow