jQuery यूआई "$ (" # डेटपिकर ")। डेटपिकर एक फ़ंक्शन नहीं है"


125

जब मैं किसी मौजूदा .aspx पृष्ठ में DatePicker, jQuery के UI प्लगइन का उपयोग करता हूं, तो मुझे त्रुटियाँ मिलती हैं:

$("#datepicker").datepicker is not a function

हालाँकि, जब मैं उसी कोड को कॉपी और पेस्ट करता हूं जो किसी HTML फ़ाइल को डेटपिकर बनाता है और उपयोग करता है जो कि एस्पक्स पेज के समान निर्देशिका में भी है, तो यह त्रुटिपूर्ण रूप से काम करता है। यह मुझे लगता है कि वहाँ aspx पृष्ठ में कुछ JS फाइलें हैं जो खजूर को रोक रहा है या शायद jQuery के UI JS फाइलें ठीक से लोड करने के लिए है।

क्या कोई भी मेरी मान्यताओं की पुष्टि कर सकता है या उस अपराधी को खोजने के लिए कोई सुझाव दे सकता है जो jQuery के UI प्लगइन्स में हस्तक्षेप कर रहा है?


क्या आप प्रासंगिक jQuery कोड पोस्ट कर सकते हैं
रस कैम

आप पृष्ठ पर डेटपिकर प्लगइन कैसे शामिल कर रहे हैं - यह एक ScriptManagerProxy में है या आप इसे सीधे पेज में लिख रहे हैं? क्या आप सुनिश्चित हैं कि इसे लोड किया जा रहा है? यदि हां, तो आप क्या अन्य प्लगइन्स शामिल हैं? क्या आप वाकई ui.core.js को शामिल कर चुके हैं?
जेम्स कोलपैक

12
मुझे समस्या मिल गई। काश, मैंने कल इस समाधान को इस प्रश्न को पोस्ट करने के बाद 1hr के विरोध के रूप में पाया। जेएस कोड जो मैंने संदर्भ jQuery और jQuery यूआई जावास्क्रिप्ट फ़ाइल को मॉड्यूल के रूप में लिखा है। इसके माता-पिता भी शरीर टैग के नीचे jQuery का संदर्भ देते हैं (इसलिए jQuery के लिए 2 संदर्भ)। चूंकि jQuery UI के बाद jQuery को फिर से संगठित किया जाता है, jQuery UI को एक प्लगइन के रूप में मिटा दिया जाता है, इसलिए मेरे कोड में DatePicker प्लगइन क्यों नहीं मिल सकता है।
Burnt1ce

चूंकि मैं वेबपैक का उपयोग कर रहा हूं, मुझे इसके बजाय jquery-ui-बंडल का उपयोग करने की आवश्यकता है। stackoverflow.com/a/39230057/470749
रयान

जवाबों:


210

मैं घंटों ऐसी ही समस्या से जूझता रहा। फिर यह पता चला कि jQuery को दो बार शामिल किया गया था, एक बार उस प्रोग्राम द्वारा जिसे मैं एक jQuery फ़ंक्शन जोड़ रहा था और एक बार हमारे इन-हाउस डिबगर द्वारा।


4
यह मेरा मुद्दा भी था। मेरे पास jQuery उपकरण CDN के साथ अपनी खुद की jQuery लाइब्रेरी का संदर्भ था जिसमें अनजाने में jQuery शामिल था।
डेविर्जिया

यह भी मेरा मुद्दा था। मैं सुपरफ़िश का उपयोग कर रहा हूं और यह भी jquery लोड कर रहा था। मैंने अब तक इसे नोटिस नहीं किया था।
rrtx2000

45
तो क्या उपाय है?
हेनरिक ऑर्डिन

8
@HenriqueOrdine डबल चेक करता है कि पेज पर दो बार jQuery शामिल नहीं है।
यूजीन वैन डेर मेरवे

यह भी मेरी समस्या थी। मैं रेल परिसंपत्ति पाइपलाइन के भीतर आम परिसंपत्तियों का उपयोग कर रहा था और दोनों मेरी शीर्ष-स्तरीय मेटा फ़ाइल (application.js) में jquery की घोषणा कर रहे थे और मेरे JS फ़ोल्डर में jquery न्यूनतम फ़ाइल थी। डबल-घोषणा करते हैं। मैंने सिर्फ jquery घोषणा को हटा दिया।
मारियो

38

यदि कोई अन्य पुस्तकालय है जो $ चर का उपयोग कर रहा है, तो आप यह कर सकते हैं:

var $j = jQuery.noConflict();
$j("#datepicker").datepicker();

यह भी सुनिश्चित करें कि आपकी जावास्क्रिप्ट में शामिल सही क्रम में हैं इसलिए jquery.ui से पहले jquery कोर लाइब्रेरी को परिभाषित किया गया है। मुझे लगता है कि मुद्दों का कारण है।


यह भी सुनिश्चित करें कि आपकी जावास्क्रिप्ट में शामिल सही क्रम में हैं इसलिए jquery.ui से पहले jquery कोर लाइब्रेरी को परिभाषित किया गया है। मुझे लगता है कि मुद्दों का कारण है << मेरे लिए सही जवाब है।
मैकासर

22

यह त्रुटि आमतौर पर तब दिखाई देती है जब आप jQuery UI सेट से किसी फ़ाइल को याद कर रहे होते हैं।

डबल-चेक करें कि आपके पास सभी फाइलें, jQuery UI फाइलें और साथ ही CSS और छवियां हैं, और वे आपके सर्वर पर सही ढंग से लिंक की गई फ़ाइल / निर्देशिका स्थान में हैं।


यह उत्तर उस समाधान के निकटतम है जिसे मैंने पोस्ट किया है।
burnt1ce

स्वयं पर ध्यान दें: सुनिश्चित करें कि स्थानीय फ़ाइलों से Google की CDN फ़ाइलों तक स्विच करने में, कि वास्तव में आपके पास सही url है। यह ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js है, ajax.googleapis.com/ajax/libs/lquery/1.10.2/jquery-ui.min.js, नहीं धत तेरे की।
नीमिनम

17

jQuery "$ (" # डेटपिकर ")। डेटपिकर एक फ़ंक्शन नहीं है"

मैंने फॉर्म के बॉडी सेक्शन में नीचे की तीन फाइलों को अंत में रखकर समस्या को ठीक किया है।

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />

1
आप एक जीवन रक्षक हैं, किसी भी तरह से सभी उत्तर, यह एक ऐसा था जिसने मुझे 2 दिनों के गैर-रोक संघर्ष के बाद बचाया।
तेजस जग्गी

8

अगर आपको लगता है कि एक संघर्ष है जिसे आप jQuery.noConflict()अपने कोड में उपयोग कर सकते हैं । विवरण डॉक्स में हैं

रेफ़रिंगिंग मैजिक - रेसक्यू फॉर जॉकी

यदि आपको हर समय पूर्ण "jQuery" लिखना पसंद नहीं है, तो कुछ वैकल्पिक शॉर्टकट हैं:

किसी अन्य शॉर्टकट के लिए jQuery को पुन: असाइन करें var $j = jQuery;(यदि आप विभिन्न पुस्तकालयों का उपयोग करना चाहते हैं तो यह सबसे अच्छा तरीका हो सकता है) निम्न तकनीक का उपयोग करें, जो आपको स्थायी रूप से $ अधिलेखित किए बिना कोड के एक ब्लॉक के अंदर $ का उपयोग करने की अनुमति देता है:

(function($) { /* some code that uses $ */ })(jQuery)

नोट: यदि आप इस तकनीक का उपयोग करते हैं, तो आप इस कैप्सूल्ड फ़ंक्शन के अंदर प्रोटोटाइप विधियों का उपयोग नहीं कर पाएंगे, जो $ को प्रोटोटाइप के $ होने की उम्मीद करते हैं, इसलिए आप उस ब्लॉक में केवल jQuery का उपयोग करने का विकल्प बना रहे हैं। DOM के लिए तर्क का प्रयोग करें तैयार घटना:

jQuery(function($) { /*some code that uses $ */ });

नोट: फिर से, उस ब्लॉक के अंदर आप प्रोटोटाइप विधियों का उपयोग नहीं कर सकते

डॉक्स के अंत से थॉट्स और आपके लिए उपयोगी हो सकते हैं


7

पहले स्पष्ट के लिए जाएं: क्या आप jquery-ui.js फ़ाइल को अच्छी तरह से संदर्भित कर रहे हैं?

यदि यह लोड है, या वेब डेवलपर टूलबार के सूचना \ View जावास्क्रिप्ट कोड को खोजने के लिए फायरबग के नेटवर्क टैब का उपयोग करने का प्रयास करें।


3

क्या आपने फायरबग का उपयोग करके 1) यह निर्धारित किया है कि कोई जावास्क्रिप्ट त्रुटियां नहीं हैं और 2) कि #datepicker तत्व पृष्ठ पर मौजूद है?

सबसे अधिक संभावना डेटपिकर कॉल से पहले एक त्रुटि है जो डेटपिकर कॉल को निष्पादित करने से रोक रही है।


2

मुझे पता है कि यह पोस्ट काफी पुरानी है, लेकिन संदर्भ के लिए मैंने इस मुद्दे को तय किया डेटपिकर के संस्करण को अपडेट

यह कोशिश करने लायक है कि वह डिबगिंग के घंटों से भी बचें।

https://cdnjs.com/libraries/bootstrap-datepicker


2
यह Jquery UI डेटपिकर पर लागू नहीं है। बूटस्ट्रैप खजूर एक अलग जानवर है।
23

1

मेरे पास बस यह मुद्दा था, और जेएस संदर्भ और कोड को पृष्ठ के निचले भाग की ओर ले जाने से पहले </body>टैग ने इसे मेरे लिए तय किया।


1

आप जिन फ़ाइलों को डाउनलोड करते हैं, उनके लिए अनुमतियों की भी जाँच करें। किसी कारण से जब मैंने इसे डाउनलोड किया था, तो डिफ़ॉल्ट रूप से इसे एक फ़ोल्डर में सहेजा गया था जिसमें कोई एक्सेस की अनुमति नहीं थी! यह पता लगाने के लिए हमेशा के लिए लिया गया कि समस्या थी, लेकिन मुझे बस निर्देशिका की अनुमति बदलनी थी और यह सामग्री है - इसलिए इसे हर जगह स्थापित करना = केवल पढ़ें। अब महान काम करता है।


1

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

समाधान यह पता लगाना था कि वास्तव में jQuery कहाँ शामिल किया जा रहा है, और उसके बाद jQuery UI स्क्रिप्ट भी शामिल है।


0

मैं बस एक ही मुद्दे में भाग गया। जब मैंने अपने स्क्रिप्ट संदर्भ को स्व-समापन टैग (यानी, <script src=".." />) से खाली नोड्स (यानी <script src=".."></script>) में बदल दिया , तो मेरी त्रुटियां दूर हो गईं और मैं अचानक jQuery UI फ़ंक्शन का संदर्भ दे सकता हूं।

उस समय, मुझे एहसास नहीं था कि यह सिर्फ एक मस्तिष्क-मस्सा था जो इसे शुरू करने के लिए ठीक से बंद नहीं करता था। (मैं इसे बस इस मौके पर पोस्ट कर रहा हूं कि किसी और को थ्रेड के पार आने से एक समान समस्या हो रही है।)


0

आप कॉल करने से पहले कुछ फ़ाइल लोड नहीं करते हैं।

उदाहरण के लिए: आपका कोड:

<%= javascript_include_tag "distpicker.min" %>
<%= javascript_include_tag "distpicker.data.min" %>

इसे बदलें:

<%= javascript_include_tag "distpicker.data.min" %>
<%= javascript_include_tag "distpicker.min" %>

0

मैं _Layout.cshtml पर jquery बंडल को हटाकर इस समस्या को ठीक कर सकता हूं

हैडर

    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/kendo/2015.2.902/kendo.all.min.js"></script>
    ...

फ़ुटबाल

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)

पाद को बदलें

    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)

0

क्या आपने $ ("# <% = txtDateElementId.ClientID%>"), तिथि-सूची () का उपयोग करने की कोशिश की है; $ के बजाय ("# txtDateElementId"); डेटपिकर (); JQuery का उपयोग करके आईडी द्वारा एक तत्व का चयन करते समय।


-1

मेरे मामले में, यह निम्नलिखित स्क्रिप्ट के आयात क्रम को बदलकर हल किया गया था: इससे पहले (काम नहीं):

काम करने के बाद):

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.