Est-il possible de dessiner un rectangle avec la souris pour sélectionner plusieurs DIVs?

Question

Je veux faire glisser un rectangle avec la souris pour sélectionner ces divs.

La div sélectionnée passera de "non" à "oui". En outre, le lien est cliquable et a dblclickable

<div id= "container" > 
    <div id="div-1" info="info1"> 
     <div class="no" id="inside"> 
      <a href="#">something</a> 
     </div> 
    </div> 
    <div id="div-2" info="info2"> 
     <div class="no" id="inside"> 
      <a href="#">something</a> 
     </div> 
    </div> 
    <div id="div-3" info="info3"> 
     <div class="no" id="inside"> 
      <a href="#">something</a> 
     </div> 
    </div> 
    <div id="div-4" info="info4"> 
     <div class="no" id="inside"> 
      <a href="#">something</a> 
     </div> 
    </div> 
</div> 

Answer 1

Utilisation du code jQuery UI sélectionnable, ajoute une classe yes à divs sélectionnés et ajoute la classe no lorsqu'un div est décochée. Le code ressemble à ceci: (. Je devais changer l'ID inside à une classe car il utilise plusieurs éléments)

$(document).ready(function(){ 
    $("#container").on("selectableselected selectableunselected", function(){ 
    $(".inside").removeClass("yes").addClass("no"); 
    $(".ui-selected > .inside").removeClass("no").addClass("yes"); 
    }); 
}); 

La solution pour ancrer les balises ne fonctionne pas à l'intérieur de sélection est ici: https://bugs.jqueryui.com/ticket/4236