it-swarm.com.ru

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

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

Я пытаюсь использовать скрипт ниже на моем сайте WordPress, чтобы отключить определенные даты в поле выбора даты в форме 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
        });

    });

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

13
Iconoclast

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

  1. Jquery.ui используется до jquery.
  2. $ Используется другой библиотекой.
  3. Библиотека jquery, на которую ссылаются локально (wordpress), имеет версию, отличную от используемой в jquery.ui.
  4. При обращении к нужной библиотеке и версии кеш браузера должен быть очищен.
21
napoleonss

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

enter image description here

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

6
Leniel Maccaferri

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

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

3
Pratswinz

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

В прошлом я получил эту ошибку раньше

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

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

1
H0miet

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

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

0
Juno Paulo De Guzman

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

0
Vidmantas Norkus

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

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

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

(видел здесь )

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

https://developer.wordpress.org/themes/basics/inclusive-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 (...) не является функцией»

поскольку функции DatePicker не включены в базовый WordPres JQuery.

0
Miquel Correa Casablanca

У меня была похожая проблема, но только в браузере Firefox. Мы используем require для загрузки файлов 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'});
    });

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

0
Web Application Developer

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

0
Vishal T