2012-10-30 29 views
5

मुझे एक ड्रॉप-क्षेत्र में केवल 1 ब्लॉक की आवश्यकता है और यदि आवश्यक हो तो स्विच करें। मैं अक्षम क्यों कर सकता हूं, लेकिन एक ड्रॉप करने योग्य फ़ंक्शन सक्षम नहीं कर सकता?मैं अक्षम क्यों कर सकता हूं, लेकिन एक ड्रॉप करने योग्य फ़ंक्शन सक्षम नहीं कर सकता?

$('.my_block').draggable({ 
    revert: "invalid",   
}); 

$('.free').droppable({   
    accept: ".my_block", 
    drop: function(ev, ui) {    
     $(this).removeClass("free");  
     $(this).addClass("1");     
     ui.draggable.appendTo($(this)).removeAttr('style'); 
      $(this).droppable("disable");    
     }, 
     out: function(ev, ui) {      
      $(this).droppable("enable");  
      $(this).removeClass("1");  
      $(this).addClass("free");    
     },   
    }); 

jsfiddle http://jsfiddle.net/4ABCN/2/:

यहाँ काम नहीं करता है मेरी कोड है

और मैं एक बटन से मुख्य पदों पर सभी लाल ब्लॉक कैसे वापस कर सकता हूं?

+0

तो आप के लिए क्या व्यवहार लक्ष्य कर रहे हैं? मैं आपकी मदद करने में सक्षम हो सकता हूं! ':)' –

+0

मुझे ड्रॉप ड्रॉप करने योग्य की आवश्यकता है, जब इसमें एक खींचने योग्य (लाल) तत्व होता है, और यदि वह छोड़ता है (वहां कोई तत्व नहीं है, तो लाल ब्लॉक को दूसरे ब्लैक ब्लॉक पर ले जाएं) मुझे इसे दोबारा सक्षम करने की आवश्यकता है। अब मैं अपनी ड्रॉप ब्लॉक को पहले ड्रॉपपैबल स्थिति में वापस नहीं कर सकता, जो अक्षम करता है :( –

+0

सावेट, नीचे पोस्ट देखें, उम्मीद है कि यह आपकी ज़रूरत के अनुरूप है! ':) ' –

उत्तर

2

कार्य डेमोहटाए गए पुराने डेमो

नई डेमो इस प्रयास करें: http://jsfiddle.net/7EbKS/

व्यवहार: उपयोगकर्ता लाल बॉक्स आप खाली स्थिति में एक दूसरे को छोड़ने के लिए अनुमति दी जाती है ले जाता है जब,

आशा है कि यह कारण :)

कोड

$(function() { 
    foo(); 

    $('.my_block').draggable({ 
     revert: "invalid", 
     stop: function() { 
      $(this).draggable('option', 'revert', 'invalid'); 
     } 

    }); 

    function foo() { 
     $('.block').droppable({ 
      greedy: true, 
      accept: ".my_block", 
      // tolerance: "fit", 
      drop: function(ev, ui) { 
       ui.draggable.appendTo($(this)).removeAttr('style'); 
      } 
     }); 
    } 
    $('.my_block').droppable({ 
     greedy: true, 
     tolerance: 'touch', 
     drop: function(event, ui) { 
      ui.draggable.draggable('option', 'revert', true); 
     } 
    }); 

}); 
+0

धन्यवाद, लेकिन "मुझे एक ड्रॉप-एरिया में केवल 1 ब्लॉक की आवश्यकता है", आपके कोड में एक से अधिक हो सकता है .. मुझे लगता है कि $ ('1' ')। droppable ("सक्षम"); कक्षाओं के साथ समस्याएं, आउट एक्शन कक्षाओं में बदलाव नहीं होता है :( –

+0

@EugenBorunoff ऊपर से मेरी अद्यतन पोस्ट देखें:: –

+1

धन्यवाद, मेरे प्यारे :) –