Ich habe die HTML-Struktur ausgeführt werden:Warum alert/console.log unter verschiedenen Mengen mit JQuery Drag & Drop
<div id="table_wrapper">
<div class="rows_table" id="rows_table_row_0">
<div class="rows_table_row highlight-row-0" id="row_0">
<div class="rows_table_cell rows_table_cell_small">row</div>
<div class="rows_table_cell rows_table_cell_small">0</div>
<div class="rows_table_cell rows_table_cell_small">TR</div>
<div class="rows_table_cell rows_table_cell_big">sujet ligne_booleen cBackCouleurTab3</div>
<div class="rows_table_cell rows_table_cell_button"><button id="remove-row-0" class="button_remove_row"><img src="remove_row-25.png"></button></div>
<div class="rows_table_cell rows_table_cell_button"><button id="select-row-0-col" class="button_select_col"><img src="select_col-25.png"></button></div>
</div>
</div>
<div class="cols_table" id="cols_table_row_0">
<div class="cols_table_body" id="cols_table_row_0_body">
<div class="cols_table_row" draggable="true" id="col_0">
<div class="cols_table_cell cols_table_cell_small">col</div>
<div class="cols_table_cell cols_table_cell_small">0</div>
<div class="cols_table_cell cols_table_cell_small">TD</div>
<div class="cols_table_cell cols_table_cell_middle">sujetCase3</div>
<div class="cols_table_cell cols_table_cell_middle">ghj</div>
<div class="cols_table_cell cols_table_cell_middle">false</div>
<div class="cols_table_cell cols_table_cell_button"><button id="remove-col-0" class="button_remove_col"><img src="remove_col-25.png"></button></div>
</div>
<div class="cols_table_row" draggable="true" id="col_1">
<div class="cols_table_cell cols_table_cell_small">col</div>
<div class="cols_table_cell cols_table_cell_small">1</div>
<div class="cols_table_cell cols_table_cell_small">TD</div>
<div class="cols_table_cell cols_table_cell_middle">sujetCase6 cBackCouleurTab4</div>
<div class="cols_table_cell cols_table_cell_middle">fghj</div>
<div class="cols_table_cell cols_table_cell_middle">false</div>
<div class="cols_table_cell cols_table_cell_button"><button id="remove-col-1" class="button_remove_col"><img src="remove_col-25.png"></button></div>
</div>
</div>
</div>
Dann mit dem Code unten ich mit Klasse cols_table_row ziehen divs wollen and-Drop in andere divs mit Klasse cols_table_row:
var colIdSource;
$('.cols_table_row').on({
dragstart: function (e) {
colIdSource = e.target.id;
e.originalEvent.dataTransfer.setData("colIdSource", colIdSource);
e.originalEvent.dataTransfer.setData("rowIdSource", row.id);
},
dragenter: function (e) {},
dragleave: function (e) {},
dragover: function (e) {
e.preventDefault();
},
drop: function (e) {
var colIdTarget = $(this).attr("id");
var colIdSource = e.originalEvent.dataTransfer.getData("colIdSource");
if (colIdSource !== colIdTarget) {
var rowIdSource = e.originalEvent.dataTransfer.getData("rowIdSource");
var rowIdTarget = $(this).parent().attr("id");
console.log("colIdSource = " + colIdSource);
console.log("colIdTarget = " + colIdTarget);
console.log("rowIdSource = " + rowIdSource);
console.log("rowIdTarget = " + rowIdTarget);
}
},
dragend: function (e) {},
click: function (e) {}
});
Hier ist die Log-Ausgabe, wenn ich div mit id col_0 ziehen und es in div mit id col_1 fallen. Ich bin in Ordnung mit ihm:
colIdSource = col_0
colIdTarget = col_1
rowIdSource = 0
rowIdTarget = cols_table_row_0_body
Aber wenn ich div mit id col_1 ziehen und es in div mit id col_0 fallen, wird der Ausgang Multiplikation mit 2:
colIdSource = col_1
colIdTarget = col_0
rowIdSource = 0
rowIdTarget = cols_table_row_0_body
colIdSource = col_1
colIdTarget = col_0
rowIdSource = 0
rowIdTarget = cols_table_row_0_body
Warum?
Here's the jsfiddle aber mit Alarm statt console.log, und es funktioniert: nur 4 Alarm in beiden Fällen sind Anzeigen, statt 8 in Fall # 2 mit console.log
Was ist die Frage? - _ "Was ist der Unterschied zwischen' console.log'/'alert'" _ und _ "Warum alert' /' console.log' verschiedene Beträge laufen lassen "_ sind sehr unterschiedliche Fragen ... – evolutionxbox
Wenn ich dein laufe jsfiddle und ändern Sie die 'alert' in' console.log' Ich kann das gleiche Problem nicht wie Sie reproduzieren. Zweitens, bist du sicher, dass du nicht versucht hast, die Zeile 2 Mal zu ziehen, bevor du die Konsole überprüfst? Wenn nicht, bitte bearbeiten Sie Ihre Geige, um das Problem neu zu erstellen –
gleiche Prise ..... – user7417866