我有一个变量在PHP,我需要它的值在我的JavaScript代码。我怎么能把我的变量从PHP到JavaScript?
我有这样的代码:
<?php
$val = $myService->getValue(); // Makes an API and database call
在同一页上,我有JavaScript代码,需要$val变量的值作为参数传递:
<script>
myPlugin.start($val); // I tried this, but it didn't work
<?php myPlugin.start($val); ?> // This didn't work either
myPlugin.start(<?=$val?>); // This works sometimes, but sometimes it fails
</script>
将数据转换为JSON
调用AJAX来接收JSON文件
将JSON转换为Javascript对象
例子:
步骤1
<?php
$servername = "localhost";
$username = "";
$password = "";
$dbname = "";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT id, name, image FROM phone";
$result = $conn->query($sql);
while($row = $result->fetch_assoc()){
$v[] = $row;
}
echo json_encode($v);
$conn->close();
?>
步骤2
function showUser(fnc) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// STEP 3
var p = JSON.parse(this.responseText);
}
}
}
假设变量总是整数。在这种情况下,这样做更容易:
<?PHP
$number = 4;
echo '<script>';
echo 'var number = ' . $number . ';';
echo 'alert(number);';
echo '</script>';
?>
输出:
<script>var number = 4;alert(number);</script>
假设你的变量不是整数,但如果你尝试上面的方法,你会得到这样的结果:
<script>var number = abcd;alert(number);</script>
但在JavaScript中,这是一个语法错误。
在PHP中,我们有一个函数json_encode,它将字符串编码为JSON对象。
<?PHP
$number = 'abcd';
echo '<script>';
echo 'var number = ' . json_encode($number) . ';';
echo 'alert(number);';
echo '</script>';
?>
因为abcd在JSON中是“abcd”,它看起来像这样:
<script>var number = "abcd";alert(number);</script>
你可以对数组使用相同的方法:
<?PHP
$details = [
'name' => 'supun',
'age' => 456,
'weight' => '55'
];
echo '<script>';
echo 'var details = ' . json_encode($details) . ';';
echo 'alert(details);';
echo 'console.log(details);';
echo '</script>';
?>
你的JavaScript代码看起来是这样的:
<script>var details = {"name":"supun","age":456,"weight":"55"};alert(details);console.log(details);</script>
控制台输出
PHP
$fruits = array("apple" => "yellow", "strawberry" => "red", "kiwi" => "green");
<script>
var color = <?php echo json_encode($fruits) ?>;
</script>
<script src="../yourexternal.js"></script>
JS (yourexternal.js)
alert("The apple color is" + color['apple'] + ", the strawberry color is " + color['strawberry'] + " and the kiwi color is " + color['kiwi'] + ".");
输出
苹果是黄色的,草莓是红色的,猕猴桃是红色的
颜色是绿色。
这是在2022年对我有用的,我使用这个解决方案来获取当前用户的电子邮件
我使用PHP创建了一个短代码,并将其添加到PHP .function:
function my_get_current_user_email(){
$current_user = wp_get_current_user();
$email = $current_user->user_email;
return $email;
}
add_shortcode( 'get_email', 'my_get_current_user_email');
然后使用div来包装短代码:
<div id="target-content" style="display: none;">
[get_email]
</div>
最后,使用JavaScript访问Div的内容:
const databox = document.getElementById("target-content");
const dataContent = databox.textContent;
console.log(dataContent)
这工作完美地为我想要的,我希望它也会为你工作。
将数据转换为JSON
调用AJAX来接收JSON文件
将JSON转换为Javascript对象
例子:
步骤1
<?php
$servername = "localhost";
$username = "";
$password = "";
$dbname = "";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error) {
die("Connection failed: " . $conn->connect_error);
}
$sql = "SELECT id, name, image FROM phone";
$result = $conn->query($sql);
while($row = $result->fetch_assoc()){
$v[] = $row;
}
echo json_encode($v);
$conn->close();
?>
步骤2
function showUser(fnc) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
// STEP 3
var p = JSON.parse(this.responseText);
}
}
}