Styling datepicker: выделить конкретные даты

Я знаю, что этот вопрос был задан до того, что «решения», которые я нашел до сих пор, похоже, не работают.Styling datepicker: выделить конкретные даты

Я использую контактную форму 7 и плагин datepicker на моем сайте Wordpress. Форма контакта и календарь работают нормально, но я хочу выделить конкретные даты, изменив цвет фона этих дат.

Вот код, который я включил в свой файл заголовка:

<script type="text/javascript"> 
$(document).ready(function() { 
var SelectedDates = {}; 
SelectedDates[new Date('07/26/2016')] = new Date('07/26/2016'); 
$('#datepicker123').datepicker({ 
    beforeShowDay: function(date) { 
     var Highlight = SelectedDates[date]; 
     if (Highlight) { 
      return [true, "Highlighted", Highlight]; 
     } 
     else { 
      return [true, '', '']; 
     } 
    } 
});

});

В моем stle.css листе, я включил следующий код, чтобы добавить стиль к этим датам:

.Highlighted a{ 
    background-color : #1AAFFF !important; 
}

Однако дата в этом примере (7/26/2016) не получает когда я нажимаю на календарь, но появляется стандартный стиль. Где моя ошибка?

Большое спасибо за вашу помощь!

Edit: HTML код казался очень долго, так вот ссылка на сайт: KYTE

Edit 2: Итак, я добавил следующий код в мой файл functions.php:

function wpse_enqueue_datepicker() { 
// Load the datepicker script (pre-registered in WordPress). 
wp_enqueue_script('jquery-ui-datepicker'); 

// You need styling for the datepicker. For simplicity I've linked to Google's hosted jQuery UI CSS. 
wp_register_style('jquery-ui', 'http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css'); 
wp_enqueue_style('jquery-ui');

} add_action ('wp_enqueue_scripts', 'wpse_enqueue_datepicker');

все еще не работает.

источник

2016-07-22 Max Imilian

Здравствуйте и добро пожаловать на SO, вы можете показать нам HTML-код вашего Datepicker? Вы можете щелкнуть правой кнопкой мыши на Datepicker, затем «Inspect Element» и скопировать код HTML. –

Спасибо Паскаль. Я просмотрел код HTML, и мне показалось, что он слишком длинный, чтобы опубликовать его здесь, поэтому я добавил ссылку на мой сайт. надеюсь, что это нормально, но, пожалуйста, дайте мне знать, если не –

datepicker не является функцией, prettyphoto не является функцией .... – vaso123

Думаю, вы не устанавливаете выделенный класс в выбранную дату. попробовать

$('td').on('click', function(){ 
    $('td.Highlighted').removeClass('Highlighted'); 
    $(this).addClass('Highlighted'); 
});

это поможет вам и изменить CSS:

tr.Highlighted { 
    background-color:red; 
}

I'v тестировал

источник

2016-07-22 14:21:12

Спасибо, Кавьян.Пробовал ваш подход, но все равно не повезло –

@MaxImilian проверить исправленный ответ –

Боюсь, что этого не происходит. Проблема заключается в том, что datepicker не распознается как функция: $ (...). Datepicker не является функцией (index): 424 Uncaught TypeError: $ (...). PrettyPhoto не является функцией. Я думаю, проблема связана с плагином. где функция datepicker определена, и мне нужно выяснить, где я могу добавить к ней дату и функцию showbeforedate. –

Вы пытаетесь вызвать метод datepiker до его библиотеки получают нагрузку.

Попробуйте поставить этот код в ваш файл functions.php

<?php 
    add_action('wp_footer', 'my_custom_js'); 
    function my_custom_js(){ 

    //Your js code goes here 

    } 
?>

источник

2016-07-23 11:25:49

Я попытался добавить его в файл functions.php (см. Код выше в моем исходном файле), но не повезло. –

Styling datepicker: выделить конкретные даты

ответ

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