Question

<script type="text/javascript">
    $(document).ready(function () {
        $(".Categories").click(function () {
            var catId = $(this).attr('id');
            catId = String(catId);

            jQuery.ajax({
                url: "index.php",
                data: { catId },
                type: "POST",
                success: function (data) {
                    $("#categoryField").html(data);
                }
            });
        });
    });
</script>

我需要将点击的按钮id传递到同一个index.php页面，无需刷新页面并使用该id值。我的代码错误，因为页面是第二次呈现

这是我的php代码：

<?php
$category=$user_home->runQuery("SELECT DISTINCT category FROM products");
$category->execute();

$categoryArray=$category->fetchAll(PDO::FETCH_ASSOC);

  foreach($categoryArray as $listID){
?>

<input type="button" id="<?php echo $listID['category']?>" class="Categories" value="<?php echo $listID["category"]?>"/><br>
<?

}
?>

Answer 1

在按钮preventDefault事件处理程序中调用click方法以防止默认按钮行为（＆＃34; 页面第二次呈现＆＃34;）：

...
$(".Categories").click(function (e) {
    e.preventDefault();
...

Answer 2

您的代码中存在语法错误

$(document).ready(function () {
    $(".Categories").click(function () {
        var catId = $(this).attr('id');
        catId = String(catId);

        jQuery.ajax({
            url: "index.php",
            data: { catId: catId },
            type: "POST",
            success: function (data) {
                $("#categoryField").html(data);
            }
        });
    });
});

您必须以有效的文字对象格式传递数据。 {“property_name”：“property_value”}。

更改：数据：{catId} 到数据： {“catId”：catId}

对于服务器端：

<?

if (isset($_POST['catId'])) {

    /* YOUR CODE FOR CATEGORY */

    $catId = intval($_POST['catId']);

    echo 'SUCCESS';

    exit(0);
}

// YOU OTHER PHP CODE 
?>

Answer 3

我想我需要将我的变量发布到另一个页面然后返回它。我不知道如何在同一页面中执行此操作。exit(0)的此变体很糟糕，因为if语句中的所有变量都是错误的exit(0)之后将被删除。

<?

if (isset($_POST['catId'])) {

    /* YOUR CODE FOR CATEGORY */

    $catId = intval($_POST['catId']);

    echo 'SUCCESS';

    exit(0);
}

// YOU OTHER PHP CODE 
?>

Js：将按钮ID传递到同一页面

3 个答案: