jQuery kullanıcı arayüzü "$ (" # datepicker "). datepicker bir işlev değil"

JQuery'nin UI eklentisi olan DatePicker'ı mevcut bir .aspx sayfasında kullandığımda şu hatalar alıyorum:

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

Ancak, datePicker'ı oluşturan ve kullanan aynı kodu, aspx sayfasıyla aynı dizinde bulunan bir HTML dosyasına kopyalayıp yapıştırdığımda, kusursuz çalışıyor. Bu, aspx sayfasında datePicker'ın veya belki jQuery'nin UI JS dosyalarının düzgün yüklenmesini engelleyen bazı JS dosyaları olduğunu varsaymamı sağlıyor.

Herhangi biri inançlarımı doğrulayabilir veya jQuery'nin UI eklentilerine müdahale eden suçluyu bulma konusunda herhangi bir ipucu sağlayabilir mi?

Saatlerce benzer bir problemle uğraştım. Daha sonra jQuery'nin bir kez jQuery işlevi eklediğim program tarafından ve bir kez de şirket içi hata ayıklayıcımız tarafından olmak üzere iki kez dahil edildiği ortaya çıktı.

$ Değişkenini kullanan başka bir kitaplık varsa, bunu yapabilirsiniz:

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

Ayrıca javascript içeriğinizin doğru sırada olduğundan emin olun, böylece jquery çekirdek kitaplığı jquery.ui'den önce tanımlanır. Bu sebeple ilgili sorunlar yaşadım.

Bu hata genellikle jQuery UI kümesinden bir dosya eksik olduğunda görünür.

Tüm dosyalara, jQuery UI dosyalarına, CSS'ye ve görüntülere sahip olduğunuzu ve bunların sunucunuzda doğru şekilde bağlanmış dosya / dizin konumunda olduğunu iki kez kontrol edin.

jQuery "$ (" # datepicker "). datepicker bir işlev değil"

Aşağıdaki üç dosyayı formun sonundaki gövde bölümüne yerleştirerek sorunu çözdüm.

  <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" />

Eğer bir çakışma olduğunu düşünüyorsanız jQuery.noConflict()kodunuzda kullanabilirsiniz . Ayrıntılar dokümanlardadır .

MAGIC'E BAŞVURMA - JQUERY İÇİN KISAYOLLAR

Her zaman tam "jQuery" yazmaktan hoşlanmıyorsanız, bazı alternatif kısayollar vardır:

JQuery'yi başka bir kısayola yeniden atayın var $j = jQuery;(Farklı kitaplıklar kullanmak istiyorsanız bu en iyi yaklaşım olabilir) Kalıcı olarak $ üzerine yazmadan bir kod bloğunun içinde $ kullanmanıza izin veren aşağıdaki tekniği kullanın:

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

Not: Bu tekniği kullanırsanız, $ 'ın Prototype's $ olmasını bekleyen bu kapsüllü işlev içinde Prototip yöntemlerini kullanamazsınız, bu nedenle bu blokta yalnızca jQuery kullanmayı seçersiniz. DOM ready olayının bağımsız değişkenini kullanın:

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

Not: Yine, bu bloğun içinde Prototip yöntemlerini kullanamazsınız

Bu, belgelerin sonundan geliyor ve sizin için yararlı olabilir

Önce bariz olanı deneyin: jquery-ui.js dosyasına iyi bir şekilde başvuruyor musunuz?

Yüklenip yüklenmediğini bulmak için firebug'ın ağ sekmesini veya Web Developer Toolbar'ın Information \ View javascript kodunu kullanmayı deneyin.

1) Javascript hatası olmadığını ve 2) #datepicker öğesinin sayfada mevcut olduğunu belirlemek için Firebug kullanmayı denediniz mi?

Büyük olasılıkla, tarih seçici çağrısından önce, tarih seçici çağrısının yürütülmesini engelleyen bir hata vardır.

Bu gönderinin oldukça eski olduğunu biliyorum, ancak referans için bu sorunu tarih seçici sürümünü güncelleyerek düzelttim

Saatlerce hata ayıklamadan kaçınmak için bunu denemeye değer.

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

Bu sorunu yeni yaşadım ve JS referanslarını ve kodu, </body>etiket benim için düzeltmeden önce sayfanın altına taşıdım.

Dosyaları indirdiğiniz dizinin izinlerini de kontrol edin. Bazı nedenlerden dolayı bunu indirdiğimde, varsayılan olarak erişime izin verilmeyen bir klasöre kaydedildi! Sorunun bu olduğunu anlamak sonsuza kadar sürdü, ancak dizin ve içeriği için izni değiştirmek zorunda kaldım - bunu HERKES = YALNIZCA OKUYUN şeklinde ayarlayarak. Şimdi harika çalışıyor.

Son zamanlarda bu sorunla karşılaştım - sorun jQuery UI dosyalarını head etiketine eklemiş olmamdı, ancak kullandığım Telerik kitaplığı gövde etiketinin altında jQuery içeriyordu (bu nedenle görünüşe göre jQuery yeniden başlatılıyor ve UI kaldırılıyor) önceden yüklenmiş eklentiler).

Çözüm, jQuery'nin gerçekte nerede dahil edildiğini bulmak ve bundan sonra jQuery UI komut dosyalarını dahil etmekti.

Ben de benzer bir sorunla karşılaştım. Komut dosyası referansımı kendi kendine kapanan etiketlerden (yani <script src=".." />) boş düğümlere (ör.<script src=".."></script> hatalarım ortadan kalktı ve aniden jQuery UI işlevlerine referans verebildim.

O zamanlar bunun, başlangıçta onu düzgün kapatmamamın sadece bir beyin osuruğu olduğunu fark etmemiştim. (Bunu sadece ileti dizisine giren başka birinin de benzer bir sorun yaşıyor olması ihtimaline göre gönderiyorum.)

Aramadan önce bazı dosyalar yüklenmez.

Örneğin: Kodunuz:

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

Şuna değiştirin:

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

_Layout.cshtml'deki jquery paketini kaldırarak bu sorunu çözebilirim

Başlık

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

Alt Bilgi

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

Altbilgiyi şu şekilde değiştir:

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

$ ("# <% = TxtDateElementId.ClientID%>"). Datepicker (); $ ("# txtDateElementId") yerine. datepicker (); JQuery kullanarak kimliğe göre bir öğe seçerken.

Benim durumumda, aşağıdaki komut dosyalarının içe aktarma sırasını değiştirerek çözüldü: Önce (Çalışmıyor):

(Çalıştıktan) Sonra: