शिफ्ट और माउस क्लिक का उपयोग करके कई तत्वों का चयन - jquery

Question

क्या jquery का उपयोग कर पृष्ठ पर एकाधिक तत्वों का चयन करने के लिए शिफ्ट और माउस क्लिक का उपयोग करना संभव है?

मैं कई divs कि मैं

मैं 1 से अधिक का चयन करने के सक्षम होना चाहते हैं नीचे शिफ्ट पकड़े और का उपयोग करके एक tabindex है, ताकि मैं उन्हें का चयन कर सकते हैं और उन्हें आदि को हटाने के जैसे काम कर सकें दे दिया है है प्रत्येक div पर क्लिक करने के लिए माउस और ऐसा करने के लिए संघर्ष कर रहा हूँ।

क्या कोई जानता है कि यह कैसे किया जा सकता है?

Answer 1

ज़रूर, तुम कुछ काम :)

पारी keydown के लिए सुनो, एक वर है कि आप अपने क्लिक हैंडलर कार्यों के भीतर से एक्सेस कर सकते हैं, अगर वर तो उस आइटम जोड़ने के लिए निर्धारित है सेट करने के लिए तैयार कर रहे हैं, (या आपके वर्तमान कार्यान्वयन के लिए उनके टैबिंडेक्स) 'एक्शन बटन' दबाए जाने पर काम करने के लिए आइटम की अपनी सूची में।

जब आप शिफ्ट कीप ईवेंट प्राप्त करते हैं तो var को अनसेट करें।

Answer 2

ऐसा लगता है कि jQuery UI Selectable आप you can try it out here के बाद क्या कर रहे हैं।

ओएस सम्मेलनों के साथ रहने के लिए, वे प्रमुख इसे इस्तेमाल करता है Ctrl और नहीं शिफ्ट है, यह एक विकल्प आप jQuery यूआई कोड को परिवर्तित किए बिना बदल सकते हैं नहीं है। आयताकार चयन के लिए तत्वों पर क्लिक और ड्रैग की सुविधा भी है ... यदि यह किसी भी उपयोग का है।

Answer 3

मैं कुछ समय पहले ऐसा ही कुछ किया था, 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' 
     } 
}); 

तो फिर तुम कार्यों है कि इस तत्व का चयन करते हैं और जो कुछ भी आप की जरूरत है क्या करना चाहिए, मैं इस प्रयोग किया जाता से अधिक तत्वों खींचें। उदाहरण यदि आप इस divs को मिटाना चाहते हैं, तो आप उदाहरण के लिए:

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

} 

$("#button").click(function(){ 
    deleteMultiSelection(); 
}) 

सावधान रहें क्योंकि मैंने इस कोड का परीक्षण नहीं किया था।

Answer 4

ईमानदार होने के लिए, एकाधिक आइटम चुनने के लिए Ctrl + बायाँ क्लिक सुंदर मानक UI व्यवहार है और jQueryUI चयन योग्य में अंतर्निहित है। क्या आप यह भी जानते थे कि आप उन्हें चुनने के लिए कई आइटमों पर फोकस कर सकते हैं और फोकस कर सकते हैं?

हालांकि, मैं प्रश्न में व्यवहार की पेशकश करने में एक लाभ देख सकता हूं, तो बाएं क्लिक या ड्रैग का उपयोग करने के बारे में कैसे चुनें और फिर बायाँ क्लिक करें और डी-सिलेक्ट करने के लिए खींचें?

यह ऐसा करने का सबसे प्रभावी तरीका नहीं हो सकता है, लेकिन इन-निर्मित कॉलबैक के साथ खेलने के बाद, मैं कुछ ऐसा काम करता हूं जो काम करने लगता है। आपके प्रश्न के कोड के आधार पर मैंने चयनित स्टोर को स्टोर करने के लिए इन-बिल्ट कॉलबैक फ़ंक्शंस में शामिल किया है और चयन हटाने को भी संभाल लिया है। जावास्क्रिप्ट नीचे डुप्लिकेट किया गया है लेकिन

Answer 5

मेरे पास एक jQuery प्लगइन है जो आप चाहते हैं कि इसे finderSelect कहा जाता है, यह Shift + Click, Ctrl + Click, Ctrl + Click + Drag और मानक किसी भी तत्व पर क्लिक करने में सक्षम बनाता है।