2009-11-01 27 views
11

मैं, कुछ एचटीएमएल 5 डेमो कोड पर काम कर रहा हूँ <input type="date" />का पता लगा रहा समर्थन jQuery

यह वर्तमान में ओपेरा 10 में ठीक से काम करता के रूप में है जैसे सामान शामिल है, लेकिन हर दूसरे ब्राउज़र सिर्फ एक सामान्य पाठ प्रदर्शित करता है के माध्यम से 5 सुविधाओं इनपुट। मैं फिर ब्राउज़र पर इस व्यवहार को ओवरराइड करने के लिए एक jQuery.date-input प्लगइन का उपयोग कर रहा हूं जो इसका समर्थन नहीं करता है।

समस्या है -, ओपेरा पर jQuery के लिए दौड़ने के रूप में अच्छी तरह तो ओपेरा में मैं दो कैलेंडर दिनांक-पिकर (ब्राउज़र से एक, jQuery से एक) हो रही है

मैं इस के आसपास अब if (window.opera) प्रयोग करने के लिए काम कर सकते हैं - लेकिन jQuery.support का उपयोग करने का कोई तरीका है, कि मैं विश्वसनीय रूप से पता लगा सकता हूं कि वर्तमान ब्राउज़र किसी विशेष HTML5 सुविधा का समर्थन करता है या नहीं?

उत्तर

17

मैं Modernizr पर एक नज़र डालेगा। यह एक ओपन सोर्स है, एमआईटी-लाइसेंसीकृत जावास्क्रिप्ट लाइब्रेरी जो कई एचटीएमएल 5/CSS3 फीचर्स के लिए समर्थन का पता लगाती है और यह वास्तव में छोटी (7 केबी संपीड़ित) है। इसका उपयोग करने के लिए, बस:

<script src="modernizr.min.js"></script> 

आपके दस्तावेज़ के <head> के भीतर। उसके बाद, आपको जो चाहिए उसे जांचने के लिए इसमें कई प्रकार के फ़ंक्शन हैं। उदाहरण:

if (Modernizr.canvas) { 
    // do stuff 
} 

विशिष्ट HTML5/CSS3 सुविधा के लिए जांच करने के कई और तरीके हैं। Check out their website इसे प्राप्त करने और दस्तावेज़ देखने के लिए।

+0

यह कुछ विस्तार करने के लिए काम करता था, लेकिन एमएसआईई अजीब चीजें करता है जब टाइप किसी चीज पर सेट होता है जिसे समझ में नहीं आता है। @ बॉबन्स का समाधान बेहतर काम करता है। –

11

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

कुछ चीजें दूसरों की तुलना में स्नीफ करना आसान होती हैं। डेट-इनपुट-समर्थन के आपके उदाहरण के लिए यह बहुत आसान है। input.type संपत्ति आपको बताती है कि ब्राउज़र किस प्रकार का नियंत्रण सोचता है; यदि दिनांक इनपुट समर्थित नहीं हैं तो आपको 'text' मिल जाएगा।

<input type="date" class="dateinput" /> 

if ($('.dateinput')[0].type!=='date') { 
    $('.dateinput').addSomeDateScriptingPluginThing(); 
} 
संबंधित मुद्दे