如何将ajax集成到Wordpress主题?

时间:2015-03-12 19:18:38

标签: javascript php jquery ajax wordpress

我正在尝试在wordpress中使用ajax

我有两个文件,php和js

这是我的PHP代码  combo_check-out.php     

function iRange($first, $last, $format = 'm/d/Y' ) { 
        $dates = array();
        $current = strtotime($first);
        $i=1;
        while( $i <= $last ) { 
            $dates[] = date($format, $current);
            $current = strtotime('+1 day', $current);
            $i++;
        }

        $time = date("m/d/Y",$current);
        return $time;
    }

if($_REQUEST)
{
    $id     = $_REQUEST['parent_id'];
    ?>


    <select name="check-out"  id="check-out-date">
        <option value="<?php echo iRange($id, 1, $format = 'm/d/Y' ) ?>">"1 Day (Same Day)"</option>
        <option value="<?php echo iRange($id, 2, $format = 'm/d/Y' ) ?>">"2 Days"</option>
        <option value="<?php echo iRange($id, 3, $format = 'm/d/Y' ) ?>">"3 Days"</option>
        <option value="<?php echo iRange($id, 4, $format = 'm/d/Y' ) ?>">"4 Days"</option>
    </select>   

<?php}?>

这里是我的js代码 combo_checkout_iRange.js

$(document).ready(function() {
    $('#loader').hide();
    $('#check-in-date').change(function(){
        $('#check-out-date-wrap').fadeOut();
        $('#loader').show();
        $.post("combo_check-out.php", {
            parent_id: $('#check-in-date').val(),
        }, function(response){
            setTimeout("finishAjax('check-out-date-wrap', '"+escape(response)+"')", 400);
        });
        return false;
    });
});

//JQuery to hide Loader and return restults
function finishAjax(id, response){
  $('#loader').hide();
  $('#'+id).html(unescape(response));
  $('#'+id).fadeIn();
} 

function alert_id()
{
    if($('#check-out-date').val() == '')
    alert('Please select a sub category.');
    else
    alert($("#check-out-date").val());
    return false;
}

他们在wordpress之外工作正常

如何将它们整合到wordpress主题中

注意:这应该适用于名为&#34; meeting&#34; 所以这就是我在function.php

上写的
add_action("wp_enqueue_scripts", function() {

     if (is_single()) {
        if (get_post_type() == 'meetings')
        {
            wp_enqueue_script('combo_checkout_iRange', get_template_directory_uri() . '/js/combo_checkout_iRange.js', array( 'jquery' ), '1.0' ,true);

        }
    }
});

1 个答案:

答案 0 :(得分:5)

第一步

你需要点击的网址是:

<?php echo admin_url( 'admin-ajax.php' ); ?>

现在有几种方法可以将其纳入js。那是你的“ajaxurl”

第二步

使用网址,您需要传递以下操作:

  

URL?行动= your_ajax_hit

在jquery中,它会像:

$.ajax({
 url : ajaxurl+'?action=your_ajax_hit',
 type : 'post'
.....
.....
.....
});

第三步

进入functions.php即可添加

add_action("wp_ajax_your_ajax_hit", "your_function_name");
add_action("wp_ajax_nopriv_your_ajax_hit", "your_function_name");

function your_function_name(){

   // your code 

  wp_die();
}

你可以看到它的

  

wp_ajax_ your_ajax_hit

多数民众赞成

请阅读:http://codex.wordpress.org/AJAX_in_Plugins