如何修复将 PHP 变量的值传递给 javascript 变量的问题

Question

挑战是如何获取包含消息长度（存储在 MYSQL 数据库中）的特定 PHP 变量（$length）以传递给 javascript 变量（var = length），以便让 javascript 决定是否在 HTML 页面上显示某个选取框。

我正在为一所小学准备一个网站。在特定页面上，他们希望有一个选框，向父母显示一些最新或紧急的信息。如果您查看页面www.transitum.org/try_1，您会看到这样一个选框示例。如果您查看页面www.transition.org/try_2，您会看到上一页的副本，不同之处在于选框仍然存在，但在此页面上没有显示任何消息。

两个选取框都是用 iframe 生成的，它的缺点是当没有显示消息时，iframe 仍然会占据一些垂直高度。理想情况下，当没有提供任何消息（内容）时，我希望 iframe 根本不可见。

显示给父级的消息是通过 PHP 脚本从 MYSQL 数据库中获取的。这个 PHP 脚本的一部分也是导出每条消息的长度（这是通过 $length = strlen($result[.....]); 完成的）并回显结果（如 echo json_encode($length) ;) 允许使用 JSON/AJAX 脚本进一步处理。

javascript 本身通过 if else 语句检查消息是否存在（因此长度 > 0 并因此显示 iframe）或是否没有消息（因此长度 = 0 并因此不显示 iframe）正在完美运行。

挑战是如何获取包含消息长度（存储在 MYSQL 数据库中）的特定 PHP 变量（$length）以传递给 javascript 变量（var = length），以便让 javascript 决定是否在 HTML 页面上显示某个选取框。

在www.transition.org/try_3 上，我正在运行以下脚本。

<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>

<script type="text/javascript">

$(document).ready(function(){

       $.ajax({

            type:'POST',

            url:'https://www.transitum.org/linski_nach/check3.php',

            dataType: "json",

            data:{length:length},

            success:function(data){

                console.log(data);

                if(data.status == 'ok'){

                var length = JSON.parse(length);

                } else {}

            }

        });

    });

document.write(length);

</script>

如果我查看控制台日志，则会显示数字“53”，这确实是Try 1页面上显示的消息长度的正确值。然而，上面的脚本总是给我“0”。因此我无法让 javascript“检测”是否有消息是/否，以及是否需要显示 iframe 是/否。

2019-08-26：所有 3 个答案都让我很好地了解了将 php 变量的值传输到 javascript 变量的机制是如何工作的。

@Halfer：我将在最后一步打开一个单独的主题来解决我的问题。在这个地方，我现在只会添加修改后的脚本和两个链接，表明 Polywhirl 先生提供的代码基本可以工作。他的以下代码（带有 if else javascript 添加）被输入到 HTML 页面中。

目前通过链接Try_5显示消息的长度和消息本身。

目前通过链接Try_6显示消息的长度和消息本身（只有没有消息的公告）。

现在唯一的问题是 HTML 页面本身不再显示......我试图找出如何获取我的 HTML 页面，如通过Try 1所见。任何建议都非常感谢。

Answer 1

在异步 Ajax 调用完成之前，您正在将长度写入页面。此外，您错误地使用了成功功能。var length = 0; // Global value$(document).ready(function() {&nbsp; $.ajax({&nbsp; &nbsp; type: 'POST',&nbsp; &nbsp; url: 'https://www.transitum.org/linski_nach/check3.php',&nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; data: { length: length },&nbsp; &nbsp; success: function(data, textStatus, jqXHR) {&nbsp; &nbsp; &nbsp; console.log(data); // 53&nbsp; &nbsp; &nbsp; if (textStatus === 'success' && jqXHR.readyState === 4) {&nbsp; &nbsp; &nbsp; &nbsp; length = JSON.parse(data); // Set the global variable&nbsp; &nbsp; &nbsp; } else {&nbsp; &nbsp; &nbsp; &nbsp; // Do nothing...&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; document.write(length); // Write out global length value&nbsp; &nbsp; }&nbsp; });});

Answer 2

您可以将变量直接输出到脚本中echo。但是一定要检查PHP输出了什么样的值。<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script><script type="text/javascript">// Variable for example$length = 53;$(document).ready(function(){&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type:'POST',&nbsp; &nbsp; &nbsp; &nbsp; url:'https://www.transitum.org/linski_nach/check3.php',&nbsp; &nbsp; &nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; &nbsp; &nbsp; data:{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; length: <?php echo $length; ?> // Output variable in length property&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; &nbsp; success:function(data){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(data);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(data.status == 'ok'){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var length = JSON.parse(length);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {}&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; });});document.write(length);</script>或者，当您有多个变量要传递时，例如关联数组，请尝试先将其转换为 JSON，然后进行回显并将其解析回 JavaScript。<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script><script type="text/javascript">// Array for example$vars = array(&nbsp; &nbsp;'length'&nbsp; &nbsp;=> 53,&nbsp; &nbsp;'string'&nbsp; &nbsp;=> 'text',&nbsp; &nbsp;'bool'&nbsp; &nbsp; &nbsp;=> true);// Encode to JSON$json = json_encode( $vars );$(document).ready(function(){&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type:'POST',&nbsp; &nbsp; &nbsp; &nbsp; url:'https://www.transitum.org/linski_nach/check3.php',&nbsp; &nbsp; &nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; &nbsp; &nbsp; data: JSON.parse(<?php echo $json; ?>), // { length: 53, string: 'text', bool: true }&nbsp; &nbsp; &nbsp; &nbsp; success:function(data){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(data);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(data.status == 'ok'){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var length = JSON.parse(length);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; } else {}&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; });});document.write(length);</script>所以 PHP can 变量只能在内echo联脚本中输出。如果您有多个变量要在 JavaScript 中使用，您可以创建一个内联脚本，将所有变量输出到 JS 中并在其他脚本中使用它们。

Answer 3

如果 console.log 有正确的数字，试试这个var length = data;<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script><script type="text/javascript">$(document).ready(function(){&nbsp; &nbsp; $.ajax({&nbsp; &nbsp; &nbsp; &nbsp; type:'POST',&nbsp; &nbsp; &nbsp; &nbsp; url:'https://www.transitum.org/linski_nach/check3.php',&nbsp; &nbsp; &nbsp; &nbsp; dataType: "json",&nbsp; &nbsp; &nbsp; &nbsp; data:{length:length},&nbsp; &nbsp; &nbsp; &nbsp; success:function(data){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log(data);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var length = data;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; });});document.write(length);</script>