JS/jQuery TypeError: jQuery (...). Datepicker не является функцией

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

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

Я могу загрузить script в jsfiddle с простым полем ввода, используя тот же идентификатор, и он отлично работает... но когда я добавляю его на свой сайт, даты не отключены, и там ошибка в JS которая говорит "jQuery (...). datepicker не является функцией"

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

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

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
        });

    });

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

Ответ 1

Вот несколько причин для этой ошибки:

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

Ответ 2

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

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

Ответ 3

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

Ответ 4

Это сработало для меня, для противоречивых кодов 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>

Ответ 5

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

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

Uncaught TypeError: Object [object Object] не имеет метода 'datepicker'

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

Ответ 6

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

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

Ответ 7

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

Ответ 8

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

Ответ 9

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

Лучшая практика включения js в wordpress - это сделать это, используя функцию Queueing в шаблоне php:

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

(см. здесь)

Он позволяет объявлять зависимости вашего script, в данном случае, jQuery datepicker. Вы можете проверить встроенные скрипты, которые Wordpress может предоставить в:

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

Wordpress предоставляет зависимости специально для jquery datepicker, поэтому вы можете включить script с чем-то вроде:

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

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

'jQuery.datepicker(...) не является функцией'

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

Ответ 10

У меня была аналогичная проблема, но только в браузере 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 и порядок не поддерживается, если вы не определяете конфигурацию shim или если ваши файлы js загружены как AMD. В нашем случае jquery загрузился после jquery-ui. Мы определили в main.js, что для jquery-ui существует зависимость от jquery. Это фиксировало это для нас