2016-06-07 80 views
2

我想將變量傳遞給特定頁面。我找到了一個簡單的例子來解釋如何在wordpress中使用ajax。Wordpress將ajax值傳遞給使用Wordpress的特定頁面

的JavaScript:

jQuery(document).ready(function($) { 

// We'll pass this variable to the PHP function example_ajax_request 
var fruit = 'Banana'; 

// This does the ajax request 
$.ajax({ 
    url: ajaxurl, 
    data: { 
     'action':'example_ajax_request', 
     'fruit' : fruit 
    }, 
    success:function(data) { 
     // This outputs the result of the ajax request 
     console.log(data); 
    }, 
    error: function(errorThrown){ 
     console.log(errorThrown); 
    } 
}); 

}); 

PHP的那條在functions.php

function example_ajax_request() { 

// The $_REQUEST contains all the data sent via ajax 
if (isset($_REQUEST)) { 

    $fruit = $_REQUEST['fruit']; 

    // Let's take the data that was sent and do something with it 
    if ($fruit == 'Banana') { 
     $fruit = 'Apple'; 
    } 

    // Now we'll return it to the javascript function 
    // Anything outputted will be returned in the response 
    echo $fruit; 

    // If you're debugging, it might be useful to see what was sent in the $_REQUEST 
    // print_r($_REQUEST); 

} 

// Always die in functions echoing ajax content 
    die(); 
} 

add_action('wp_ajax_example_ajax_request', 'example_ajax_request'); 


    wp_localize_script('ajax-script', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php'))); 

插入可惜我不能傳遞變量。我檢查了代碼,我得到這個錯誤:

Error: ajax_object is not defined 

你也許知道另一種獲得相同結果的方法嗎?

+0

** ** wp_localize_script會希望有一個名爲** ajax_object變量**,所以你可以嘗試評論這個,看看它是否有效,所以你會知道錯誤是從那裏來的? – TheFallen

+0

嗨,LoicTheAtzec 我不太明白你的例子。 我可以請你用blockquote寫你的建議嗎? – Daniel

回答

5

你是非常接近的,但有一些小東西丟失...

我的意思是在我的評論是什麼,就是你需要它用於使用'ajax-script'這樣兩個:

add_action('wp_enqueue_scripts', 'add_js_scripts'); 
add_js_scripts(){ 
    wp_enqueue_script('ajax-script', get_template_directory_uri().'/js/script.js', array('jquery'), '1.0', true); 
    wp_localize_script('ajax-script', 'ajax_object', array('ajaxurl' => admin_url('admin-ajax.php'))); 
} 

改變$_REQUEST$_POST

function example_ajax_request() { 

    // The $_REQUEST contains all the data sent via ajax 
    if (isset($_POST)) { 

     $fruit = $_POST['fruit']; 

     // Let's take the data that was sent and do something with it 
     if ($fruit == 'Banana') { 
      $fruit = 'Apple'; 
     } 

     // Now we'll return it to the javascript function 
     // Anything outputted will be returned in the response 
     echo $fruit; 

     // If you're debugging, it might be useful to see what was sent in the $_POST 
     // print_r($_POST); 

    } 

    // Always die in functions echoing ajax content 
     die(); 

} 

新增add_action('wp_ajax_nopriv_ …)

add_action('wp_ajax_nopriv_example_ajax_request', 'example_ajax_request'); // <= this one 
add_action('wp_ajax_example_ajax_request', 'example_ajax_request'); 

對於您的jQuery腳本script.js文件中,有2個重要遺漏的小東西:

jQuery(document).ready(function($) { 

    /* We'll pass this variable to the PHP function example_ajax_request */ 
    var fruit = 'Banana'; 

    /* This does the ajax request */ 
    $.ajax({ 
     url: ajax_object.ajaxurl, /* <====== missing here */ 
     type : 'post', /* <========== and missing here */ 
     data: { 
      'action':'example_ajax_request', 
      'fruit' : fruit 
     }, 
     success:function(data) { 
      /* This outputs the result of the ajax request */ 
      console.log(data); 
     }, 
     error: function(errorThrown){ 
      console.log(errorThrown); 
     } 
    }); 

}); 

這應該現在的工作...

參考文獻:

0

您正在使用wp_localize_script錯誤。在PHP代碼中,刪除wp_localize_script行。

選項,您可以(也應該)添加以下

// this line is for users who are not logged in 
add_action('wp_ajax_nopriv_example_ajax_request', 'example_ajax_request'); 
0

一切都是正確的,除了你必須添加 ajax_object.ajax_url而不是ajaxurl在網址:的阿賈克斯$函數參數as

jQuery(document).ready(function($) { 

// We'll pass this variable to the PHP function example_ajax_request 
var fruit = 'Banana'; 

// This does the ajax request 
$.ajax({ 
    url: **ajax_object.ajax_url**, 
    data: { 
     'action':'example_ajax_request', 
     'fruit' : fruit 
    }, 
    success:function(data) { 
     // This outputs the result of the ajax request 
     console.log(data); 
    }, 
    error: function(errorThrown){ 
     console.log(errorThrown); 
    } 
}); 

}); 

複製並粘貼上述腳本代替$ .ajax函數 如果您想查看ajax_object是什麼。ajax_url然後 警惕它inisde你的代碼,它會提醒這是需要使用AJAX路徑您的管理員AJAX文件 WordPress的