doulu1020
doulu1020
2018-06-17 09:55

如何从HTML调用php函数

I am playing around with GPIO pins on a raspberry pi and have been trying to teach myself how to get them to function via a webpage, I am familiar with python, CSS and HTML but not so much with javascript so I am struggling with this code.

I followed a tutorial on youtube where I built a basic webpage with 2 buttons that turns on and off an LED on a breadboard.

As I have the code written there, the code works fine, the LED's turn on and off.

I am trying to add more buttons to the page but I am having trouble accessing the javascript so the LED will turn on. The functioning web page is as follows.

   <!DOCTYPE html>
<html>
        <head>
        <style>
        </style>
                <meta charset="UTF-8">
                <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
                <script type="text/javascript">
                        $(document).ready(function(){
                                $('#clickOn').click(function(){
                                        var a = new XMLHttpRequest();
                                        a.open("GET","pinOn.php");
                                        a.onreadystatechange=function(){
                                                if(a.readyState==4){
                                                        if(a.status == 200){
                                                        }
                                                        else alert("HTTP ERROR!");
                                                }
                                        }
                                        a.send();
                                });
                         $('#clickOff').click(function(){
                                        var a = new XMLHttpRequest();
                                        a.open("GET","pinOff.php");
                                        a.onreadystatechange=function(){
                                                if(a.readyState==4){
                                                        if(a.status == 200){
                                                        }
                                                        else alert("HTTP ERROR!");
                                                }
                                        }
                                        a.send();
                                });
                        });
                </script>
                <title>Pi GPIO Controller</title>
        </head>
        <body>
                <h1><center>Turn the light on and off!</center></h1></br></br>
                <div class="button">
                <center><button type="button" id="clickOn">ON</center></button></br>
                <center><button type="button" id="clickOff">OFF</center></button></br>
                </div>
        </body>
</html>

This is the pinOff.php file that sets pin 4 to high.

<?php
        system("gpio -g mode 4 out");
        system("gpio -g write 4 1");
?>

And the pinOn.php to set it to pin low.

<?php
        system("gpio -g mode 4 out");
        system("gpio -g write 4 0");
?>

I am trying to add another button and have tried simply adding:

<center><button type="button" id="clickOff">OFF</center></button></br>

But it isn't working.

How can I call the javascript in a button to get the code in the pinOn and pinOff files to work.

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答