Я добавляю элементы / тексты в часть тела html, используя jQuery. И я использую метод appendTo для добавления контента в div, но он всегда добавляется в последний момент, а не туда, где я хочу его отбросить.
Пожалуйста, дайте мне знать, какой метод я могу использовать для достижения этого.
Я реализую функциональность почтового тела, где я могу написать что угодно и вставить любой текст между ними.
Пожалуйста, предложите.
JQuery версия 3 +
Фрагмент кода:
<div class="row">
<div class="col-sm-4">
<div class="draggable">
<p>Name</p>
<p>Lastname</p>
<p>Age</p>
<p>City</p>
</div>
</div>
<div class="col-sm-8">
<h4>Droppable Area</h4>
<div id="contentarea" contenteditable="true" style="width:100%; height: 200px">
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$( ".draggable" ).draggable({
revert: "invalid",
stack: ".draggable",
appendTo: 'body',
//scroll: false,
helper: 'clone',
start: function(e, ui)
{
$(ui.helper).addClass("ui_atdrag_custom_class");
},
stop: function(e, ui)
{
$(ui.helper).removeClass("ui_atdrag_custom_class");
},
});
$( "#contentarea" ).droppable({
accept: ".draggable",
tolerance: "touch",
drop: function( event, ui ) {
var droppable = $(this);
var draggable = ui.draggable;
draggable.clone().appendTo(droppable);
//$(this).find("p").addClass( "ui_dropped_content");
}
});
});
Любая скрипка была бы более полезной. Но ее следует отбрасывать везде, где я хочу удалить текст / ссылку.