通过AJAX将PHP变量传递给另一个DIV中的PHP变量

时间:2017-03-28 19:50:04

标签: javascript php jquery python ajax

我一直在研究这一天,但是当我学习AJAX时,我觉得我对各种方法感到困惑。我希望我的网站显示Python脚本的结果。我能做到。

问题是脚本的结果是随机变化的(这是我车库门的状态)如果车库门的状态发生变化,我的网站很笨重。通常,用户必须不断重新加载页面才能获得当前状态。我正在尝试让DIV显示状态,每5秒更新一次,从而显示新状态。

Python脚本大约需要4秒才能运行,因此我想继续将其作为函数调用,并将其作为DIV传递到我想要显示结果的网站上。

如果可能,一个PHP文件(index.php)。这是我要做的事情的骨架。我的get_status函数有效,但我对其余部分感到茫然。

谢谢。

编辑:代码更新了评论者发现的小调整。

<html>
<body>

<?php
    function get_status(){
        $status = shell_exec('python /path/to/garage_door/myq-garage.py status');  //Equals either 'Open' or 'Closed'
        echo $status;
    }
?>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
    var java_status = <?php echo json_encode(get_status) ?>;

    // I have no idea how to pass a variable from PHP thru javascript to PHP on the 
    // same page.  Trying to pass on results of get_status function every 5 seconds.

    setInterval(function(){

        $.ajax({
            url: "index.php"
            type: "POST"
            dataType: "json"
            data: ({status: java_status}),
            success: function(data){
                $("#status_div").html(data);
            }
        })

    }, 5000);
</script>

<div id="status_div">
    <?php
        $new_status = json_decode(data);
    ?>        

    // I have no idea how to get that status variable here.
    The Garage Door Status is:  <?php 
        echo $new_status;
    ?>

</div>
</body>
</html>

3 个答案:

答案 0 :(得分:2)

要正确执行此操作,您必须拥有有效的HTML,并且不需要向PHP脚本发送任何参数。此外,您需要将PHP与其余代码分开,否则您将获得AJAX响应中的所有标记:

PHP脚本 - php_python.php

<?php
    function get_status(){
        $status = shell_exec('python /path/to/garage_door/myq-garage.py status');  //Equals either 'Open' or 'Closed'
        echo $status;
    }
    get_status(); // execute the function
?>

HTML页面 - index.php(注意使用文档就绪处理程序,因为脚本位于页面顶部)

您还需要分隔<script>个标签,使用一个加载jQuery库,另一个标记来描述您的JavaScript函数。

<html>
    <head>
        <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
        <script type="text/javascript">
        $(function(){ // you need a document ready handler if you put the script at the top of the page
            setInterval(function(){
                $.ajax({
                    url: "php_python.php",
                    type: "POST",
                    dataType: "text",
                    success: function(data){
                        $("#status_div").html('The Garage Door Status is: ' + data);
                    }
                })

            }, 5000);
        });
        </script>
    </head>
    <body>   
        <div id="status_div"></div>
    </body>
</html>

如果您只是学习jQuery的AJAX here are some basic tips for setting it up and trouble-shooting problems

答案 1 :(得分:0)

创建一个页面并将其命名为status.php

status.php包含以下代码:

    $status = shell_exec('python /path/to/garage_door/myq-garage.py status');        
    echo $status;

制作另一个页面index.php并包含 -

<div id="status_div">

</div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>


   <script type="text/javascript">

    setInterval(function(){

        $.ajax({
            url: "status.php",

            dataType: "html",

            success: function(data){
                $("#status_div").html(data);
            }
        })

    }, 5000);
</script>

希望这会对你有所帮助

答案 2 :(得分:0)

如果你正在使用ajax,你可以让生活变得轻松:

function_status.php:

<?php
function get_status(){
        $status = shell_exec('python /path/to/garage_door/myq-garage.py status');     //Equals either 'Open' or 'Closed'
        return $status; //avoid echo in such functions, try to not produce side effects
    }

ajax_server.php:

<?php
require_once("function_status.php");
echo get_status();

的index.php:

<?php
require_once("function_status.php");
?>
<html>
<body>
<div id="status">
<?php echo get_status(); ?>
</div>

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js">
<script type="text/javascript">

( //run function immediatly
  function($){ //in this anonymous function, $ is always jQuery
     function updateStatus(){
         $.ajax({
            url: "ajax_server.php"
            type: "POST"
            dataType: "json"
            data: ({status: 1}),
            success: function(data){
                $("#status").html(data);
            }
        });
     }

     //first call it onload
     $(function(e){
        updateStatus();
     }

     //and then every 5 seconds
     setInterval(updateStatus, 5000);
     );
   }

)//run function immediatly
(jQuery); //pass parameter jQuery to immediate execution of anonymous function



</script>
</body>
</html>

它不是一个非常干净的方式,我只使用<?php echo get_status(); ?>,因为你的python脚本需要4秒,所以你在前4秒没有状态。 否则你可以把它改成index.html并且有一个很好的分离的html和php,如果你想要用ajax填充html。 如果你真的想将它破解成一个文件,你需要一个

if(isset($_POST['status'])){
echo get_status();
}else{
//output the html around the whole thing
}