从 jquery 到 PHP wordpress 的变量

Question

我在 Wordpress 中构建，我知道我需要使用 AJAX，但不知道如何使用。

我有一个下拉选择框，当用户选择一个选项时，会出现一个 div。

该 div 中的数据需要从自定义帖子中提取，因此我有一个 php 变量来执行此操作。

我需要做的是能够根据下拉菜单的选择来更改该 php 变量。

我可以在 jQuery 中做到这一点，但我不知道如何将 jQuery var 传输到 php。

任何帮助将不胜感激。

$(document).ready(function(){
$('select').change(function(){
    $( 'select option:selected').each(function(){
        if($(this).attr('value')=='choose'){
            hide_visible();
        }  

        var val = $('#course_select option:selected').val();

        var course_id;  

        if (val == 'CPR'){
            course_id = 106; <!--  I need to send this to php -->
            $( '#course_id' ).val(course_id); 
        };


        if($(this).attr('value') == val){
            if ($( '.course-info ' ).is(':visible')) {
                $( '.course-info' ).slideUp( 'slow' ).delay(700);
                $( '.iframe' ).slideUp( 'slow' );
                $( '.form' ).slideUp( 'slow' );
                $( '.'+ val ).slideDown( 'slow' );
            }else{
                $('.iframe').slideUp( 'slow' );
                $( '.course-info' ).slideUp( 'slow' );
                $( '.'+ val  ).slideDown( 'slow' );
            };
        }           
    });
}).change();

});

Answer 1

从您编辑的问题中，您可以执行以下操作：

$('.result-element').load('my-page.php?courseid=' + courseId);

查看 api.jquery.com/load 以了解更多信息是使用 jQuery.load()。

您的 my-page.php 可以从 $_GET['courseid'] 获取“courseid”，您可以将原始 HTML 回显为“部分”，jQuery 会自动将其添加到“.result-element”元素中。

Answer 2

您不需要 PHP 变量。

在您的下拉列表的更改事件中，获取选定的值，然后构建您的 ajax 查询并将其发送到服务器。

查看以下jQuery函数：ajax()、change()、val()、html()、show()。

您还需要为 jQuery 设置一个端点来请求数据。像http://domain.com/api/get-my-data 这样的东西。这是一个 wordpress 任务（即 PHP）。此端点/脚本应返回一个 JSON 编码的对象，其中包含您的 div 的内容。

Answer 3

也许这有助于您也使用 jquery。欢呼男人:)

$(document).ready(function(){
$('select').change(function(){
$( 'select option:selected').each(function()
{
    if($(this).attr('value')=='choose')
    {
        hide_visible();
    }  

    var val = $('#course_select option:selected').val();

    var course_id;  

    if (val == 'CPR')
     {
        course_id = 106; // Sample code where you can send your jquery variable to php page
        $.post("send_variable.php", {id:val}, function(data){
                alert(data) //shouts the data from send_variable.php page    
                $("#hiddenTextbox").val(data); //this passes the value from send_variable.php to a textbox with Id(hiddenTextbox) into the page 
        });
        $( '#course_id' ).val(course_id); 
     }


    if($(this).attr('value') == val)
    {
        if ($( '.course-info ' ).is(':visible')) 
        {
            $( '.course-info' ).slideUp( 'slow' ).delay(700);
            $( '.iframe' ).slideUp( 'slow' );
            $( '.form' ).slideUp( 'slow' );
            $( '.'+ val ).slideDown( 'slow' );
        }
        else
        {
            $('.iframe').slideUp( 'slow' );
            $( '.course-info' ).slideUp( 'slow' );
            $( '.'+ val  ).slideDown( 'slow' );
        }
    } 
 }

});
}).change();

这里是 send_variable.php 的代码

 <?php
     $val1 = $_POST['id'];
     echo $val1; //thus returning the data that depends on your selected from dropdown
  ?>

希望这会有所帮助:)