通过 jQuery ajax PHP 和数据库获取数据

Question

我的代码不能完全按照我的需要工作，2 页 php 和 1 个 jquery 文件通过 jquery Ajax 获取数据。 首页名称 catfd.php ：

 <input type="checkbox" value="2" class="catcf"> catfd2 <br />
 <input type="checkbox" value="35" class="catcf"> catfd35 <br />
 <input type="checkbox" value="22" class="catcf"> catfd22 <br />
 <input type="checkbox" value="133" class="catcf"> catfd133 <br />
 <input type="checkbox" value="28" class="catcf"> catfd28 <br />
 <input type="checkbox" value="33" class="catcf"> catfd33 <br />
 <input type="checkbox" value="55" class="catcf"> catfd55 <br />
 <input type="checkbox" value="44" class="catcf"> catfd44 <br />

和第二个页面名称getvalue.php 如果 var '$catcfid' 恰好是我从 catfd.php 中的输入文件中选择的一个，则此页面给了我正确的答案（我认为 Jquery ajax 的问题

if(isset($_POST['catcf'])){
$catcfid= $_POST['catcf'];
$sql = 'SELECT * FROM tablename  where cat_id = '.$catcfid.' order by p_id asc';
$catandproid = $wpdb->get_results($sql);
foreach($catandproid as $key){
    echo $key->title;
}

}

这是 jquery ajax 文件

$(document).ready(function(){
    $(".catcf").on('click', function() {

        if ($('input.catcf').is(':checked')) {        

              
        var catcf = Number($(this).val());
        
            $(".catcf").val(catcf);

            $.ajax({
                url: 'getvalue.php',
                type: 'post',
                data: {catcf:catcf},
                beforeSend:function(){
                    $(".main-area-courses-continer").html("Looding....");
                },
                success: function(response){

                    // Setting little delay while displaying new content
                    setTimeout(function() {
                        // appending posts after last post with class="post"
                        $(".main-area-courses-continer:last").after(response).show().fadeIn("slow");

                
                        
                    }, 2000);


                }
            });
        


            }
        });


});

代码正在运行，但给我的结果是重复第一个复选框值，我选择它的意思是 jquery 没有更改 class="catcf" 的值，因为每个类都有 unic 值。我将使用复选框中的多个选项。 我想使用此复选框从数据库中获取不同的结果。

Answer 1

您的问题是以下行：

$(".catcf").val(catcf);

这里发生的情况是您选中了所有复选框 ($(".catcf"))，然后将它们的 value 属性更改为单击复选框的值。删除此行，它应该可以按预期工作。