PHP / Javascript / Python没有重新加载div

时间:2014-12-30 22:53:46

标签: javascript php python html forms

我正在使用覆盆子pi将继电器(在下面的表格上提交)发送到另一台设备,如果成功发出脉冲,将打开/关闭继电器。切换的继电器作为输入返回到pi,该输入在加载div内的status.php页面上被监视。如果我加载下面的页面,它会正确显示status.php,但在按下表单提交按钮后,它不会重新加载status.php页面。我已经尝试了我能想到的一切,请帮忙!

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Alarm Panel</title>
  <link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
  <script src="http://code.jquery.com/jquery-2.1.3.min.js"></script>
  <script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
  <script type="text/javascript">// <![CDATA[
     $(document).ready(function() {
                    $.ajaxSetup({ cache: false });
     setInterval(function() {
     $('#loading').load('/status.php');
     }, 2000);
     });
// ]]>
</script>
  <?php
     if (isset($_POST['PULSE'])) {
            shell_exec('python /usr/lib/cgi-bin/pulse.py');
        }
  ?>
</head>
<body>
  <div id="currentstatus" data-role="collapsible" data-theme="b" data-content-theme="b" data-collapsed="false">
     <h1>Current status</h1>
     <div id="loading" align="center">
        <H3>Loading Status...</H3>
     </div>
  </div>
  <div data-role="collapsible" data-theme="b" data-content-theme="b">
     <h4>Change Status</h4>
     <form method="post">
        <input type="submit" name="PULSE" value="PULSE" />
     </form>
  </div>
  </body>
  </html>

status.php     <?php $status = shell_exec('python /usr/lib/cgi-bin/status.py'); ?> <h3><? echo $status; ?></h3> <br /> <img src="/img/<? print $status; ?>.jpg" height="250"; width="250";>

1 个答案:

答案 0 :(得分:0)

您是否尝试过操纵提交行为?这可能会解决它。

$(document).on('click', '[name="pulse"]', function(e) {
    e.preventDefault();
    $('#loading').load('/status.php');
});

您也可以尝试更改超时功能......这有点棘手,因为加载是异步功能。

var loadStatusTimeout;
function loadStatus() {
     $('#loading').load('/status.php', function() {
         loadStatusTimeout = setTimeout(loadStatus, 2000);
     });
}
loadStatusTimeout = setTimeout(loadStatus, 2000);

另外,你不小心在你的img元素中添加了分号:

变化:

<img src="/img/<? print $status; ?>.jpg" height="250"; width="250";>

为:

<img src="/img/<? print $status; ?>.jpg" height="250" width="250">