Drag and drop

La source

Ajouter attributs HTML draggable="true" et ondragstart="drag(event)" à n'importe quelle balise et définir la valeur transférée dans la fonction "drag". Le plus souvent:

function drag(e) {e.dataTransfer.setData('text',e.target.id)}

la cible

Ajouter attributs HTML ondragover="event.preventDefault()" ondrop="drop(event)" à balise cible puis récupérer et traiter la donnée transférée dans fonction "drop".
Se rappeler que l'utilisateur peut dropper du texte, une image, un chiffre, depuis autre appli... 12, 20, 50, -10

function drop(e) {
	e.preventDefault() //"Standard"
	var data=e.dataTransfer.getData('text') //"Standard"
	var aAjouter=parseInt(data)||0; // si texte droppé
	e.target.innerHTML=parseInt(e.target.innerHTML)+aAjouter
}

Exemple

Faire glisser vers cases bleues pour additionner.

-2