无需Ajax将jQuery变量值传递给PHP变量的实现方法

兄弟，你当前的代码逻辑是走不通的，得先给你理清楚核心问题：PHP是服务器端语言，会在页面发送到浏览器之前就执行完毕；而jQuery/JS是客户端语言，只有等页面加载到浏览器后才会运行。所以你在JS代码块里直接写<?php $cattitle = myvar; ?>的时候，PHP根本不知道myvar是什么——这时候JS还没执行呢，myvar这个变量连影子都没有。

下面给你几个不用Ajax的可行实现思路：

思路1：用表单隐藏字段+提交 #

把JS获取到的值存入表单的隐藏输入框，然后提交表单，PHP就能通过表单数据拿到这个值了。

示例代码：

<html> 
<head> 
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script> 
$(document).ready(function(){ 
  var myvar = $("#myHeader").html(); 
  // 把值存入隐藏输入框
  $("#hiddenCattitle").val(myvar);
  // 提交表单（也可以绑定按钮点击事件触发提交）
  $("#myForm").submit();
}); 
</script> 
</head> 
<body> 
<div id="myHeader">Hello World!</div> 
<form id="myForm" method="post" action="your_php_file.php">
  <input type="hidden" id="hiddenCattitle" name="cattitle">
</form>
</body> 
</html>

然后在your_php_file.php里就能拿到值：

<?php
$cattitle = $_POST['cattitle'];
echo $cattitle; // 输出 Hello World!
?>

思路2：通过URL参数跳转 #

把JS变量拼到URL的查询参数里，跳转到目标PHP页面，PHP用$_GET来获取参数值。

示例代码：

<html> 
<head> 
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script> 
$(document).ready(function(){ 
  var myvar = $("#myHeader").html(); 
  // 对参数编码避免特殊字符问题
  var encodedVar = encodeURIComponent(myvar);
  // 跳转到PHP页面并携带参数
  window.location.href = "your_php_file.php?cattitle=" + encodedVar;
}); 
</script> 
</head> 
<body> 
<div id="myHeader">Hello World!</div> 
</body> 
</html>

对应的PHP代码：

<?php
$cattitle = $_GET['cattitle'];
echo $cattitle; // 输出 Hello World!
?>

思路3：用Cookie传递 #

通过JS把变量值存入浏览器Cookie，然后PHP读取这个Cookie的值。

示例代码：

<html> 
<head> 
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script> 
$(document).ready(function(){ 
  var myvar = $("#myHeader").html(); 
  // 把值存入Cookie，注意编码和有效期设置
  document.cookie = "cattitle=" + encodeURIComponent(myvar) + "; path=/";
  // 跳转到PHP页面（或者刷新当前页面让PHP读取Cookie）
  window.location.href = "your_php_file.php";
}); 
</script> 
</head> 
<body> 
<div id="myHeader">Hello World!</div> 
</body> 
</html>

PHP读取Cookie的代码：

<?php
if(isset($_COOKIE['cattitle'])){
  $cattitle = urldecode($_COOKIE['cattitle']);
  echo $cattitle; // 输出 Hello World!
}
?>

内容的提问来源于stack exchange，提问作者Ravi Varma