Comment implémenter le tri par glisser-déplacer de la souris dans un tableau HTML

Cette fois, je vais vous montrer comment implémenter le tri par glisser-déposer de tableaux en HTML. Quelles sont les précautions pour utiliser HTML pour implémenter le tri par glisser-déposer de tableaux. Voici un cas pratique, prenons un. regarder.

1. Importez le fichier

<script src="js/jquery-1.10.1.min.js"></script> 
<link rel="stylesheet" href="Public/css/jquery-ui.min.css"> 
<script src="js/jquery-ui.min.js"></script>

2. Joignez la classe tricapable

<tbody class="sortable"> 
   <tr></tr> 
   <tr></tr>  
</tbody>

$(function() { 
    $(".sortable").sortable({ 
        cursor: "move", 
        items: "tr", //只是tr可以拖动 
        opacity: 0.6, //拖动时，透明度为0.6 
        revert: true, //释放时，增加动画 
        update: function(event, ui) { //更新排序之后 
            var categoryids = $(this).sortable("toArray"); 
            var $this = $(this); 
        } 
    }); 
    $(".sortable").disableSelection(); 
});

Comment utiliser la balise img des images HTML

Quels sont le nom, l'identifiant et la classe en HTML ? Quelle est la différence

Comment utiliser HTML+CSS pour afficher la barre de menu secondaire en glissant la souris

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!