2014-12-13 7 views
6

datepicker를 내 WordPress 템플릿 페이지의 양식에있는 사람에게 보내고 싶지만 작동하지 않습니다. 내가 페이지 mypage.php이를했습니다 그런 다음wordpress에서 jquery datepicker를 사용하십시오.

function modify_jquery() { 
    if (!is_admin()) { 
     // comment out the next two lines to load the local copy of jQuery 
     wp_deregister_script('jquery'); 
     wp_register_script('jquery', 'http://ajax.googleapis.com/ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js', false, '2.1.1'); 
     wp_enqueue_script('jquery'); 
    } 
} 
add_action('init', 'modify_jquery'); 
function load_jquery_ui_google_cdn() { 
    global $wp_scripts; 

    wp_enqueue_script('jquery-ui-core'); 
    wp_enqueue_script('jquery-ui-slider'); 

    // get the jquery ui object 
    $queryui = $wp_scripts->query('jquery-ui-core'); 

    // load the jquery ui theme 
    $urlui = "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js"; 
    wp_enqueue_style('jquery-ui-smoothness', $urlui, false, null); 
} 

add_action('wp_enqueue_scripts', 'load_jquery_ui_google_cdn'); 

:

   <script> 
    $(function() { 
    $("#datepicker").datepicker(); 
    }); 
       </script> 
...other code... 
Date: <input type="text" id="datepicker"> 
...other code... 
     </form> 

그러나이 표시되지 않습니다

내가 자식 테마의 functions.php를했습니다 코드입니다 . 무엇이 잘못되었는지 바람 날 수 있도록 도와 주시겠습니까?

+0

참조하시기 바랍니다 자세한 내용은 (당신은'ajax.googleapis.com/ajax.googleapis.com'있다). 'datepicker()'를 어디에도 포함 시켰습니까? 나는 그것이 기본 jQuery가 아닌 jQuery UI의 일부라고 생각한다. – Hobo

+0

@Hobo 답장을 보내 주셔서 감사합니다. 첫 번째 게시물에 표시된대로 jQueryi UI를 추가했지만 여전히 작동하지 않습니다. – testermaster

답변

23

jQuery를로드하는 데 사용하는 코드가 유효하지 않으며 datepicker (jQuery UI Datepicker)를 전혀로드하지 않습니다. WordPress에서 jQuery를 사용하는 올바른 방법에 관한 몇 가지 답변을 게시 했으므로 더 많은 것을 읽고 싶으면 작업 예제와 링크를 제공 할 것입니다.

당신이 당신의 아이 테마의 functions.php에 삽입 한 코드 바꾸기 : 마지막으로 사용을 대체

/** 
* Load jQuery datepicker. 
* 
* By using the correct hook you don't need to check `is_admin()` first. 
* If jQuery hasn't already been loaded it will be when we request the 
* datepicker script. 
*/ 
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'); 

는 :

<script> 
    jQuery(document).ready(function($) { 
     $("#datepicker").datepicker(); 
    }); 
</script> 
로딩

jquery requires the word Jquery instead of $

+0

작동하기 시작했습니다. 감사합니다! 이제 trasparent 배경에 캘린더가 표시됩니다. 여기에 기본 레이아웃을 갖는 방법은 무엇입니까? http://jqueryui.com/datepicker/#default – testermaster

+0

jQuery UI 스타일 시트를로드하는 것과 관련된 세부 정보를 포함하도록 답변을 업데이트했습니다. –

+0

업데이트를 테스트하고 캐시를 지우지 만 투명 배경을 유지합니다. 양해 해 주셔서 감사합니다. – testermaster

1

스크립트 &를 벨로우즈 스타일은 테마 functions.php 파일에 벨로우즈 코드를 추가합니다. 프런트 엔드 사용 백엔드 사용

function add_e2_date_picker(){ 
    //jQuery UI date picker file 
    wp_enqueue_script('jquery-ui-datepicker'); 
    //jQuery UI theme css file 
    wp_enqueue_style('e2b-admin-ui-css','http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css',false,"1.9.0",false); 
    } 
    add_action('admin_enqueue_scripts', 'add_e2_date_picker'); 

에 대한

function add_e2_date_picker(){ 
//jQuery UI date picker file 
wp_enqueue_script('jquery-ui-datepicker'); 
//jQuery UI theme css file 
wp_enqueue_style('e2b-admin-ui-css','http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.0/themes/base/jquery-ui.css',false,"1.9.0",false); 
} 
add_action('wp_enqueue_scripts', 'add_e2_date_picker'); 

스크립트에 대한

스크립트 그냥도 funtions.php 파일을이 코드를 삽입하거나 그 코드를 울부 짖는 소리.

function register_datepiker_submenu() { 
    add_submenu_page('options-general.php', 'Date Picker', 'Date Picker', 'manage_options', 'date-picker', 'datepiker_submenu_callback'); 
} 

function datepiker_submenu_callback() { ?> 

    <div class="wrap"> 

    <input type="text" class="datepicker" name="datepicker" value=""/> 

    </div> 

    <script> 
    jQuery(function() { 
     jQuery(".datepicker").datepicker({ 
      dateFormat : "dd-mm-yy" 
     }); 
    }); 
    </script> 

<?php } 
add_action('admin_menu', 'register_datepiker_submenu'); 
?> 

이 코드를 추가 한 후 관리자 메뉴 -> Settigns-> 날짜 선택에 날짜 선택을 가지고 있습니다. 귀하의 jQuery URL이 잘못 보이는 Add a jQuery DatePicker to WordPress Theme or Plugin

관련 문제