J'ai la structure HTML ci-dessous:Pourquoi alerte/console.log exécuter différentes quantités avec 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>
Puis, avec le code ci-dessous je veux traîner avec divs classe cols_table_row et déposez-le dans d'autres divs avec classe 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) {}
});
est ici la sortie du journal lorsque je fais glisser div id avec col_0 et déposez-le dans div avec id col_1. Je suis ok avec elle:
colIdSource = col_0
colIdTarget = col_1
rowIdSource = 0
rowIdTarget = cols_table_row_0_body
Mais quand je fais glisser div id avec col_1 et déposez-le dans div avec id col_0, la sortie est 2 multiplier par:
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
Pourquoi?
Here's the jsfiddle mais avec alerte au lieu de console.log, et cela fonctionne: seulement 4 alerte témoignez au deux cas, au lieu de 8 dans le cas n ° 2 avec console.log
Quelle est la question? - _ "Quelle est la différence entre' console.log'/'alert'" _ et _ "Pourquoi" alert'/'console.log' exécute-t-il des quantités différentes" _ sont des questions très différentes ... – evolutionxbox
Quand je lance votre jsfiddle et change le 'alert' en' console.log' je ne peux pas reproduire le même problème que vous. Deuxièmement, êtes-vous sûr que vous n'avez pas essayé de faire glisser la ligne 2 fois avant de vérifier la console. Si non, s'il vous plaît modifier votre violon pour recréer le problème –
même pincée ..... – user7417866