WordPress AJAX - 存储jquery变量并在php中回显它 - function.php?

时间:2013-08-31 10:39:09

标签: php jquery ajax wordpress

是否可以将jQuery变量发送到function.php,并在某些php函数中使用它?通过AJAX或可能。

主题相关,不使用插件。

EG。 我在点击后通过jQuery在'客户端'添加了一些后期CSS类。

我可以在'服务器端'使用这个类,所以我可以在我的主题的任何页面中传递它们吗?

4 个答案:

答案 0 :(得分:4)

WordPress环境

首先,为了完成这项任务,建议注册然后将jQuery脚本排队,将请求推送到服务器。这些操作将挂钩在wp_enqueue_scripts动作挂钩中。在同一个钩子中,您应该将wp_localize_script用于包含任意Javascript。通过这种方式,前端将有一个JS对象。该对象继续使用jQuery句柄使用的正确url。

请看一下:

  1. wp_register_script();功能
  2. wp_enqueue_scripts hook
  3. wp_enqueue_script();功能
  4. wp_localize_script();功能
  5. 档案:functions.php 1/2

    add_action( 'wp_enqueue_scripts', 'so18550905_enqueue_scripts' );
    function so18550905_enqueue_scripts(){
      wp_register_script( 'ajaxHandle', get_template_directory() . 'PATH TO YOUR SCRIPT FILE', array(), false, true );
      wp_enqueue_script( 'ajaxHandle' );
      wp_localize_script( 'ajaxHandle', 'ajax_object', array( 'ajaxurl' => admin_url( 'admin_ajax.php' ) ) );
    }
    

    档案:jquery.ajax.js

    此文件进行ajax调用。

    jQuery(document).ready( function($){
      //Some event will trigger the ajax call, you can push whatever data to the server, simply passing it to the "data" object in ajax call
      $.ajax({
        url: ajax_object.ajaxurl, // this is the object instantiated in wp_localize_script function
        type: 'POST',
        data:{
          action: 'myaction', // this is the function in your functions.php that will be triggered
          name: 'John',
          age: '38'
        },
        success: function( data ){
          //Do something with the result from server
          console.log( data );
        }
      });
    });
    

    文件:functions.php 2/2

    最后在你的functions.php文件中应该有你的ajax调用触发的函数。 记住后缀:

    1. wp_ajax(仅限注册用户或管理面板操作的功能)
    2. wp_ajax_nopriv(允许没有特权用户的功能)
    3. 这些后缀加上操作组成了您的操作名称:

      wp_ajax_myactionwp_ajax_nopriv_myaction

      add_action( 'wp_ajax_myaction', 'so18550905_wp_ajax_function' );
      add_action( 'wp_ajax_nopriv_myaction', 'so18550905_wp_ajax_function' );
      function so18550905_wp_ajax_function(){
        //DO whatever you want with data posted
        //To send back a response you have to echo the result!
        echo $_POST['name'];
        echo $_POST['age'];
        wp_die(); // ajax call must die to avoid trailing 0 in your response
      }
      

      希望它有所帮助!

      如果不清楚,请告诉我。

答案 1 :(得分:3)

是的,您可以使用AJAX发送您的jQuery变量。 (或任何Javascript变量)

只需执行JSON.stringify(any-Variable-Here),然后获得相应的字符串。

通过AJAX将值发送到任何php文件,如:

var toBeSent = JSON.stringify($($('#selector')[0]).attr('class'));
$.ajax({
  type: "POST",
  url: 'function.php',
  data: toBeSent,
  success: function(data){ // any action to be performed after function.php returns a value.
  },
  dataType: 'text'
});

注意:我在这里对项目进行了字符串化,以便您可以通过简单的拆分来访问服务器端的变量。

答案 2 :(得分:3)

当然可以

$('element').click(function(e){
    e.preventDefault();
    var el = $(this);

    //do stuff on click

    //send this elements class to the server    
    $.ajax({
       url: "some.php",
       data: {
           class: el.attr('class')
       },
       success: function(r){
           alert("class name sent successfully to some.php");
       }
    });
});

答案 3 :(得分:2)

另一种选择可能是$.post()

$(document).ready( function() {

$('#myDiv').click(function(){
var myClass = $(this).attr('class');
var url = 'page.php';
   $.post(url, { class: myClass })
   .done( function() {
     alert('class sent to ' + url);
   });
 }); 

});