我如何使用多个按钮通过PHP运行多种功能

Question

I managed to get my previous project working where I click a button on a webpage and it makes some text change on the webpage for all the devices that are viewing it, by making the button click run PHP code which tells all devices to run a JavaScript function, which reads the value of a text file that the PHP code is changing.

Now I want to do the same thing, but I want to have 3 different buttons that are running 3 different JavaScript functions on all the devices viewing the webpage.

I have tried making 3 different PHP files, and 3 different text files, and 3 different functions, but it didn't work (it seemed to think I was clicking the buttons when I wasn't), and also seemed like not a very efficient way to do it. I think it was to do with having multiple $.get() functions running at once, for all the different functions.

How would I have 1 PHP file, and 1 $.get() function and make this work?

Thanks, Fjpackard.

Edit: Here is the code I tried, although I would like it if I could do it a different and more efficient way if possible.

index.html:

<title>PHP Test</title>
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script>

    var theButton;

    function myClick()
    {
        $.post('script.php', {});
    }

    function myClick2()
    {
        $.post('script2.php', {});
    }

    function myClick3()
    {
        $.post('script3.php', {});
    }

    function myFunc() {
        //The code you want to run on the clients
        $("#theDiv").text("Say Hello");
        setTimeout(function(){
            $("#theDiv").text("");
        },2000);
    }

    function myFunc2() {
        //The code you want to run on the clients
        $("#theDiv").text("Say Goodbye");
        setTimeout(function(){
            $("#theDiv").text("");
        },2000);
    }

    function myFunc3() {
        //The code you want to run on the clients
        $("#theDiv").text("Zip Your Mouth");
        setTimeout(function(){
            $("#theDiv").text("");
        },2000);
    }

    var lastValue = '';
    var lastValue2 = '';
    var lastValue3 = '';

        $("document").ready(function() {
        var deviceAgent = navigator.userAgent.toLowerCase();
        var agentID = deviceAgent.match(/(iphone|ipod|ipad)/);
        if (agentID) {

            // mobile code here
            $("#btn1").remove();
            $("#btn2").remove();
            $("#btn3").remove();
            setInterval(function() {
                $.get(
                    'script.php',
                    {},
                    function (data) {
                        if (data != lastValue) {
                            myFunc();
                            lastValue = data;
                        }
                    }

                );
                /*$.get(
                    'script2.php',
                    {},
                    function (data2) {
                        if (data2 != lastValue2) {
                            myFunc2();
                            lastValue = data2;
                        }
                    }

                );
                $.get(
                    'script3.php',
                    {},
                    function (data3) {
                        if (data3 != lastValue3) {
                            myFunc3();
                            lastValue = data3;
                        }
                    }

                );*/
            },100);

        }
        else {
            $("#theDiv").remove();
        }


    });

</script>
<div id="theDiv"></div>
<button id="btn1" class="btn" onclick="myClick()">Say Hello</button><br>
<button id="btn2" class="btn" onclick="myClick2()">Say Goodbye</button><br>
<button id="btn3" class="btn" onclick="myClick3()">Zip Your Mouth</button>

script.php:

<?php
    // Disable cache
    header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");
    header('Cache-Control: max-age=0, no-cache, no-store, must-revalidate');
    header('Cache-Control: post-check=0, pre-check=0', false);
    header("Pragma: no-cache");

    $file = 'file.txt';

    if ($_SERVER['REQUEST_METHOD'] === 'POST')
    {
        // POST request

        $previous = file_get_contents($file);
        if ($previous === 'true')
        {
            file_put_contents($file, 'false');
        }
        else
        {
            file_put_contents($file, 'true');
        }
    }
    else
    {
        // not POST request, we assume it's GET

        echo file_get_contents($file);
    }
    exit();
?>

script2.php:

<?php
    // Disable cache
    header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");
    header('Cache-Control: max-age=0, no-cache, no-store, must-revalidate');
    header('Cache-Control: post-check=0, pre-check=0', false);
    header("Pragma: no-cache");

    $file = 'file2.txt';

    if ($_SERVER['REQUEST_METHOD'] === 'POST')
    {
        // POST request

        $previous = file_get_contents($file);
        if ($previous === 'true')
        {
            file_put_contents($file, 'false');
        }
        else
        {
            file_put_contents($file, 'true');
        }
    }
    else
    {
        // not POST request, we assume it's GET

        echo file_get_contents($file);
    }
    exit();
?>

script3.php:

<?php
    // Disable cache
    header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");
    header('Cache-Control: max-age=0, no-cache, no-store, must-revalidate');
    header('Cache-Control: post-check=0, pre-check=0', false);
    header("Pragma: no-cache");

    $file = 'file3.txt';

    if ($_SERVER['REQUEST_METHOD'] === 'POST')
    {
        // POST request

        $previous = file_get_contents($file);
        if ($previous === 'true')
        {
            file_put_contents($file, 'false');
        }
        else
        {
            file_put_contents($file, 'true');
        }
    }
    else
    {
        // not POST request, we assume it's GET

        echo file_get_contents($file);
    }
    exit();
?>

Answer 1

You could use some GET parameters and an array in the php file:

JS code:

function myClick()
    {
        $.post('script.php?button=1', {});
    }

    function myClick2()
    {
        $.post('script.php?button=2', {});
    }

    function myClick3()
    {
        $.post('script.php?button=3', {});
    }

And then in script.php :

<?php
    session_start();
    // Disable cache
    header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");
    header('Cache-Control: max-age=0, no-cache, no-store, must-revalidate');
    header('Cache-Control: post-check=0, pre-check=0', false);
    header("Pragma: no-cache");

    $fileArray = array("1" => "file.txt", "2" => 'file2.txt', "3" => 'file3.txt');

    if(isset($_SESSION['lastFile']) && !isset($_GET['button'])){
        $file = $_SESSION['lastFile'];
    }else if(isset($_GET['button'])){
        $file = $fileArray[$_GET['button']];
    }else{
        $file = "file.txt";
    }

    $_SESSION['lastFile'] = $file;

This way, if no GET parameter is set, the script will fall back on an previous used file ( set in the session ), or else load the default ( file.txt )

So if you do the Ajax request to script.php?button=2 , file file2.txt will be loaded, and inserted into the session variable .

Later when you request script.php ( without the button part ), the script detects that there isn't any button get variable . But it knows there is an variable in the session with the previous used file, so the script will then load the previous used file.