डबल क्लिक करें अक्षम सलेक्ट बॉक्स

Question

मैं फार्म की डबल क्लिक पर सभी प्रपत्र तत्वों सक्षम करने के लिए कोशिश कर रहा हूँ सक्षम करने के लिए, और इस प्रकार कोड को सरल बनाया गया है:

<form> 
    <input type="text" name="foo" disabled /> 
    <select name="bar" disabled> 
     <option>a</option> 
     <option>b</option> 
    </select> 
</form> 

<script type="text/javascript"> 
    $(function() { 
     $('form').dblclick(function() { 
      $(this).find('input,select').removeAttr('disabled'); 
     }); 
    }); 
</script> 

हालांकि, प्रपत्र डबल क्लिक करें ईवेंट को सक्रिय नहीं है अक्षम <select> तत्व पर होवर करते समय। और दुर्भाग्यवश, "readonly" attribute<select> तत्वों पर काम नहीं करता है।

यह एक आंतरिक अनुप्रयोग के लिए है, और मुझे केवल इसे Google क्रोम पर कार्य करने की आवश्यकता है।

अद्यतन:

मैं इस पर जवाब का एक समूह हो रही है, और मुझे लगता है कि मैं अपने प्रश्न मदद करने के लिए प्रक्रिया ... क्या विकलांग प्रपत्र तत्वों पर W3C कल्पना करता है मार्गदर्शन में संशोधन करने की जरूरत है कहते हैं? ... ऐसा लगता है कि उदाहरण के लिए फ़ायरफ़ॉक्स में अक्षम <input> तत्वों पर डबल क्लिक ईवेंट आग नहीं लगाता है। शायद यह तथ्य कि क्रोम में आग लगती है वह एक बग/मिसाइलमेंट डब्ल्यू/स्पेक है जिसे मैं हमेशा वहां पर भरोसा नहीं कर सकता।

फिलहाल, फॉर्म के ऊपर एक बिल्कुल स्थित रैपर तत्व पर डबल क्लिक ईवेंट देखने के लिए सबसे अच्छा विकल्प लगता है ... भले ही मैं अतिरिक्त रैपर तत्वों को जोड़ने से नफरत करता हूं।

Answer 1

आपको लगता है कि इस्तेमाल कर सकते हैं:

DEMO

$(function() {  
    $('form').dblclick(function() { 
     $(this).find('input,select').removeProp('disabled').removeClass('no-pointer'); 
    }).find(':input').addClass('no-pointer'); 
}); 

सीएसएस:

.no-pointer{pointer-events:none} 

Answer 2

मैं सुझाव देता हूं कि div पूरे फॉर्म को ओवरले कर दें, और उस पर क्लिक हैंडलर रखें। विकलांग फ़ील्ड फायर हैंडलर पर क्लिक नहीं करते हैं।

Answer 3

आज़माएं:

HTML:

<div id="wrapper"> 
    <form> 
     <input type="text" name="foo" disabled/> 
     <select name="bar" disabled> 
      <option>a</option> 
      <option>b</option> 
     </select> 
    </form> 
</div> 

jQuery:

$('#wrapper').dblclick(function() { 
    $('form').find('input, select').prop('disabled', false); 
}); 

लाइव डेमो:

http://jsfiddle.net/oscarj24/TvBR6/3/

(बस लाल div डबल क्लिक करें और एक बार देख ले)।