Question

这是我的HTML代码：

<form class="addtowatchlistform" action="logo/insertwatchlist.php" method="POST">

    <input type="hidden" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'"/>
    <button id="addtowatchlistbutton" type="submit" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'" data-tooltip="'.$addremove.' TO YOUR WATCHLIST" class="material-icons" style="color:'.$watchlisticoncolor.'">add_box</button>

</form>

   // Same form as above
<form class="addtowatchlistform" action="logo/insertwatchlist.php" method="POST">

    <input type="hidden" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'"/>
    <button id="addtowatchlistbutton" type="submit" name="tmdb_id" value="'.$result[$x]["tmdb_id"].'" data-tooltip="'.$addremove.' TO YOUR WATCHLIST" class="material-icons" style="color:'.$watchlisticoncolor.'">add_box</button>

</form>

Jquery代码：

<script>
$(".addtowatchlistform").submit(function(e) {
  var data = $(this).serialize();
  var url = $(this).attr("action");
  $.post(url, data, function() {

  });
  return false;
});
</script>

目前的情况如何？

当有人点击add_box（提交表单）按钮时，它会在后台运行insert.php。

insert.php文件在其中设置了2个变量，即：

$addremove和$watchlisticoncolor。我想在我的主文件中运行这些变量。（您可以在<form>标记内找到这些变量，我想替换它们），实时无需重新加载页面。

如何使用Jquery或PHP ajax代码执行此操作？

Answer 1

如评论所示，您可以使用JSON数据在服务器和客户端之间交换所需的数据

服务器代码（insertwatchlist.php）文件

<?php
$response = new \stdClass();
$response->addremove = "item1";//you can get the data anyway you want(e.g database)
$response->watchlisticoncolor = "red";
die(json_encode($response));

您的客户端ajax功能可能是这样的

$.post(url, data, function() {
    try {
        data = JSON.parse(data);
        $("button#addtowatchlistbutton").data('tooltip', data.addremove + " TO YOUR WATCHLIST");
        $("button#addtowatchlistbutton").css('color',data.watchlisticoncolor);
    } catch (e) {
        console.log("json encoding failed");
        return false;
    }
});

使用Ajax实时更改2个PHP变量的值（从外部文件接收）

1 个答案: