pseudocódigo
DIV1
--IMG 1
--IMG 2
DIV2
--IMG 3
--IMG 4
Lo que pretendo que suceda es que las imágenes en DIV1 y DIV2 deberían poder intercambiarse... pero solo puede ocurrir un INTERCAMBIO a la vez. si se intercambian 1 y 3, entonces no puedo intercambiar 3 con 4 solo después de reemplazar 1 y 3 puedo hacer otro intercambio...
Además, nunca debería poder intercambiar dentro de un div.
Entiendo los conceptos básicos de arrastrar y soltar HTML, pero no estoy seguro de cómo poner restricciones en el intercambio. No necesito CÓDIGO, sin embargo, solo un camino para comenzar.
Establezca un atributo de datos en cada imagen que contenga una referencia a la división principal.
Recorra las imágenes en la interacción, si encuentra una imagen con un atributo principal que no coincide con su principal actual, deshabilite el arrastre.
Eche un vistazo a las listas clasificables de Jquery que tienen gran parte de la funcionalidad que está buscando lista para usar y le permite probar el destino y el origen, lo que le permitiría implementar el no intercambio dentro de div.