2013-08-22 2 views
13

Я почесываю голову на это в течение 2 дней, уверен, что я просто пропустил что-то простое, но не могу для жизни Я понимаю, почему он не работает.JS/jQuery TypeError: jQuery (...) datepicker не является функцией

Я пытаюсь использовать сценарий ниже на моем сайте WordPress, чтобы отключить определенные даты в поле datepicker в форме ContactForm7.

Я могу загрузить скрипт в jsfiddle с помощью простого поля ввода, используя тот же идентификатор, и он отлично работает ... но когда я добавляю его на свой сайт, даты не отключены, и в ошибке JS возникает ошибка консоль, которая говорит «Jquery (...). DatePicker не является функцией»

Я добавил это в моем header.php файла, чуть ниже wp_head() вызова и чуть выше </head> тега. Я назначил поле datepicker с идентификатором dpick, как это использует сценарий.

Я читал, что эта ошибка обычно вызывается при использовании $ символ, поскольку он может конфликтовать с другими скриптами JQuery внутри WordPress ... поэтому они предложили заменить $ с jQuery вместо (который я сделал в приведенном ниже сценарии). ..но я все еще получаю ошибку

var unavailableDates = ["1-9-2013", "2-9-2013", "3-9-2013", "4-9-2013", "5-9-2013"]; 

    function unavailable(date) { 
      dmy = date.getDate() + "-" + (date.getMonth() + 1) + "-" + date.getFullYear(); 
      if (jQuery.inArray(dmy, unavailableDates) == -1) { 
       return [true, ""]; 
      } else { 
       return [false, "", "Unavailable"]; 
     } 
    } 

     jQuery(function() { 
      jQuery('#dpick').datepicker({ 
       dateFormat: 'dd MM yy', 
       beforeShowDay: unavailable 
     }); 

    }); 

не могу отблагодарить вас за любую помощь, вы можете предложить ... это кажется такой простой вещи, но я просто не могу обернуть мою голову вокруг него!

+0

Вы включили jquery ui library на свой сайт? – maverickosama92

+0

@ maverickosama92 да, я считаю, что это часть вызова 'wp_head() ... когда я просматриваю источник моей страницы, я вижу, что он вызывает ядро ​​jquery ui, а также кучу определенных jquery ui модулей – Iconoclast

+0

Похоже, что все, кроме jQuery UI datepicker, включено на ваш сайт. Можете взглянуть на это. Ядро не включает datepicker автоматически http://i.imgur.com/Hd9FdsL.png – vernak2539

ответ

1

У меня нет большого опыта работы с wordpress, поэтому я могу быть не в порядке, чтобы помочь. Хотя я использовал pickadate.

В прошлом я получил эту ошибку до того

Uncaught TypeError: Object [object Object] has no method 'datepicker'

Это обычно происходит потому, что я не загрузит JS-файлы в правильном порядке. В инструментах разработчика на вашем сайте я не вижу, где плагин pickadate даже загружен. Я бы проверил (если вы еще этого не сделали), чтобы убедиться, что плагин загружается, а также загружается в правильном порядке.

+0

Знаете ли вы, какую ссылку мне нужно использовать, чтобы использовать datepicker? Я попытался, но он все еще не работает. – Iconoclast

21

Существует несколько причин возникновения этой ошибки:

  1. jquery.ui используется до JQuery.
  2. $ используется другой библиотекой.
  3. jquery lib, на который ссылается локально (wordpress), имеет другую версию, использующую jquery.ui.
  4. Когда ссылка на нужную библиотеку и версию будет указана, кеш браузера должен быть очищен.
+0

Похоже, что jQuery загружен до jQueryUI, так что все должно быть в порядке. Я не использую $ в скрипте, так что все должно быть в порядке. Согласно моей панели инструментов WP все в курсе, поэтому я не думаю, что это из-за разных версий jQuery ... – Iconoclast

+0

ошибка 1 была для меня проблемой. –

+0

jquery.ui используется перед jquery. Это самая распространенная причина. –

0

Хорошо, у меня такая же проблема, и решение проблемы просто добавить, чтобы включить jquery.ui.datepicker.js, оно включено в пакет jquery. Однако мне все еще интересно, почему я должен включить это, потому что я использую jquery.ui раньше и jquery.ui.custom или просто файл jquery js будет выполнять функцию .datepicker() для меня.

Во всяком случае, все еще приятно работать. Надеюсь это поможет.

+0

эй вы можете дать мне cdn этого. Не удается найти номер –

+0

. Ответ ur не работает здесь. – Jogi

6

У меня была такая же проблема. В моем случае у меня было две ссылки сценария jQuery на моей главной странице (_Layout.cshtml в ASP.NET MVC).Я добавил 1 ссылку на JQuery на вершине, но был 1 в нижней части страницы, что я не заметил ... В Firebug это то, что я видел:

enter image description here

Так как вы можете видеть , jQuery UI сидел в середине конфликта! : D Это заняло у меня некоторое время, чтобы понять.

+0

помогите мне alot ... так что вы удаляете его после 'jquery-ui-1.10.3.js' –

3

проверьте, загружены ли все файлы. Должен иметь статус 200 ok.

+1

Хорошо, я часами ищу эту ошибку, а затем один файл css не был загружен ... Ваш ответ я смотрю Фидлера, и теперь все работает нормально ... –

0

Я переместил все сценарии из сноске к голове, то все начало работать propertly

0

Я знаю, что это старый вопрос. У меня была эта же проблема, и это было из-за включения jquery.min.js вместе с jquery-1.10.2.js и jquery-ui.js. Поэтому, удалив jquery.min.js, моя проблема с TypeError: $ (...). Datepicker не является функцией, которая была решена. Надеюсь, это кому-то поможет.

0

Я знаю, этот вопрос старый, но может быть это может помочь другим людям:

Лучше всего включить JS в WordPress это сделать это с помощью его функции массового обслуживания в шаблоне PHP:

wp_enqueue_script('script', get_template_directory_uri() . '/js/script.js', array ('jquery'), 1.1, true); 

(см. here)

Это позволяет объявлять зависимости вашего скрипта, в данном случае, jquery datepicker. Вы можете проверить де встроенные сценарии, которые WordPress могут предоставить в:

https://developer.wordpress.org/themes/basics/including-css-javascript/#default-scripts-included-and-registered-by-wordpress

Wordpress обеспечивают зависимости специально для Jquery DatePicker, чтобы вы могли включать в свой сценарий с чем-то вроде:

wp_enqueue_script('script', 'mypath' . '/js/script.js', array ('jquery', 'jquery-ui-datepicker'), 1.7, true); 

Обратите внимание, что если вы только объявляете зависимость jquery, вы получите сообщение об ошибке, например

'jQuery.datepicker(...) is not a function'

с функции datepicker не включены в базовый jquery wordpres.

3

Это работает для меня, конфликтующих Jquery коды -

<script> 
    $.noConflict(); //Not to conflict with other scripts 
jQuery(document).ready(function($) { 
$("#datepicker").datepicker({ 
    dateFormat:"yyyy-mm-dd", 
    changeMonth: true, 
    changeYear: true, 
    maxDate: "+0D" 
}); 

}); 
</script> 
0

У меня была аналогичная проблема, но только в FireFox браузере. Мы используем для загрузки js-файлов. У меня были следующие строки в моем javascript.

require(['jquery', 'jqueryui'], function ($) { 
    $(document).ready(function() { 
     $("#form1").validationEngine({ bindButtons: $(".bindButton") }); 

     $("#txtBidDate").datepicker({dateFormat: 'mm-dd-yy'}); 
     $("#txtInstDate").datepicker({dateFormat: 'mm-dd-yy'}); 
    }); 

Требовать загружает JS файлы asynchroulsy и порядок не gauranteed, если не определить регулировочной шайбы конфигурации или если ваши JS файлы все загружены, как AMD. В нашем случае jquery загрузился после jquery-ui. Мы определили в main.js, что для jquery-ui существует зависимость от jquery. Это исправлено для нас

Смежные вопросы