使用shift和鼠标单击选择多个元素 – jquery

是否可以使用shift和鼠标单击使用jquery在页面上选择多个元素?

我有几个div,我给了tabindex,以便我可以选择它们,并可以做删除它们等事情。

我希望能够通过按住shift并使用鼠标点击每个div来选择多于1,并且我正在努力做到这一点。

有谁知道如何做到这一点?

不久前我用jQuery做了类似的事:

$(id).click(function(event){ //Mouse Click+shift event if(event.shiftKey){ //give some attribute that can indentify the elements of the selection //example rel='multi-selection' or class='multi-selection' } }); 

然后你应该做一些选择这个元素并做你需要的函数,我用它来拖动多个元素。 例如,如果要删除此div,可以举例如:

 function deleteMultiSelection(){ $('html').find('div[rel=multi-selection']).each(function(){ $(this).remove(); }) } $("#button").click(function(){ deleteMultiSelection(); }) 

小心,因为我没有测试这段代码。

我有一个jQuery插件,可以完全按照你想要的方式调用finderSelect它可以实现Shift +单击,Ctrl +单击,Ctrl +单击+拖动和标准单击任何元素。

听起来像jQuery UI Selectable就是你所追求的, 你可以在这里尝试一下 。

为了保持OS惯例,它们使用的键是Ctrl而不是Shift ,这不是一个可以在不更改jQuery UI代码本身的情况下更改的选项。 它还具有点击和拖动元素的function,以获得矩形选择…如果有任何用途。

当然,如果你愿意做一些工作:)

监听shift keydown,设置一个可以从单击处理函数中访问的var,如果设置了var,则将该项(或当前实现的tabindex)添加到要处理的项目列表中。按下“动作按钮”。

获得shift keyup事件时取消设置var。

说实话,Ctrl +左键单击选择多个项目是非常标准的UI行为,内置于jQueryUI Selectable。 您是否也知道可以左键单击并将焦点拖到多个项目上以选择它们?

但是,我可以看到提供相关行为的优势,那么如何使用左键单击或拖动来选择,然后左键单击并拖动也取消选择?

它可能不是最有效的方式,但在玩完内置回调之后,我想出了一些似乎有用的东西。 基于你问题中的代码,我已经连接到内置的回调函数来存储所选的内容并处理选择删除。 JavaScript重复下面但是