Question

我正在编写一个在网络浏览器中运行的游戏应用程序。到目前为止，我得到了几乎所有用PHP和HTML / CSS编写的东西。我目前的目标是在运行某个Javascript事件时触发PHP函数。确切地说，当（JS）currentTime在demo.js中达到0时，我想将php bool设置为true或直接从class.game.php触发php函数

这是我的index.php文件的一部分，我实现了timer元素。

您好

我正在编写一个在网络浏览器中运行的游戏应用程序。到目前为止，我得到了几乎所有用PHP和HTML / CSS编写的东西。我目前的目标是在运行某个JS事件时触发PHP函数。确切地说，当（JS）currentTime在demo.js中达到0时，我想将php bool设置为true或直接从class.game.php触发php函数。下面我将向您展示部分代码。

一些包括：

的index.php

<script type="text/javascript" src="inc/jquery.min1.js"></script>
<script type="text/javascript" src="inc/jquery.timer.js"></script>
<script type="text/javascript" src="inc/demo.js"></script>

这是我的index.php文件的一部分，我实现了timer元素。

的index.php

<div id="countdown" style="float: right; margin-top: 60px; margin-right: 30px">01:00:00 </div>

    <form id="example2form" style="float: right; margin-top: 25px;">
        <input type='button' value='Play/Pause' onclick='Example2.Timer.toggle();' />
        <input type='button' value='Stop/Reset' onclick='Example2.resetCountdown();' />
        <input type='text' name='startTime' value='300' style='width:30px;' />
    </form>

这是demo.js

的一部分

demo.js

/**
 * countdown function
 */
var Example2 = new (function() {
    var $countdown,
        $form, // Form used to change the countdown time
        incrementTime = 70,
        currentTime = 1000,
        updateTimer = function() {
            $countdown.html(formatTime(currentTime));
            if (currentTime == 0) {
                Example2.Timer.stop();
                timerComplete();
                Example2.resetCountdown();


                return;
            }
            currentTime -= incrementTime / 10;
            if (currentTime < 0) currentTime = 0;
        },
        timerComplete = function() {
            alert('Example 2: Countdown timer complete!');

        },
        init = function() {
            $countdown = $('#countdown');
            Example2.Timer = $.timer(updateTimer, incrementTime, true);
            $form = $('#example2form');
            $form.bind('submit', function() {
                Example2.resetCountdown();
                return false;
            });
        };
    this.resetCountdown = function() {
        var newTime = parseInt($form.find('input[type=text]').val()) * 100;
        if (newTime > 0) {currentTime = newTime;}
        this.Timer.stop().once();
    };
    $(init);
});

jquery.timer.js

;(function($) {
    $.timer = function(func, time, autostart) { 
        this.set = function(func, time, autostart) {
            this.init = true;
            if(typeof func == 'object') {
                var paramList = ['autostart', 'time'];
                for(var arg in paramList) {if(func[paramList[arg]] != undefined) {eval(paramList[arg] + " = func[paramList[arg]]");}};
                func = func.action;
            }
            if(typeof func == 'function') {this.action = func;}
            if(!isNaN(time)) {this.intervalTime = time;}
            if(autostart && !this.isActive) {
                this.isActive = true;
                this.setTimer();
            }
            return this;
        };
        this.once = function(time) {
            var timer = this;
            if(isNaN(time)) {time = 0;}
            window.setTimeout(function() {timer.action();}, time);
            return this;
        };
        this.play = function(reset) {
            if(!this.isActive) {
                if(reset) {this.setTimer();}
                else {this.setTimer(this.remaining);}
                this.isActive = true;
            }
            return this;
        };
        this.pause = function() {
            if(this.isActive) {
                this.isActive = false;
                this.remaining -= new Date() - this.last;
                this.clearTimer();
            }
            return this;
        };
        this.stop = function() {
            this.isActive = false;
            this.remaining = this.intervalTime;
            this.clearTimer();
            return this;
        };
        this.toggle = function(reset) {
            if(this.isActive) {this.pause();}
            else if(reset) {this.play(true);}
            else {this.play();}
            return this;
        };
        this.reset = function() {
            this.isActive = false;
            this.play(true);
            return this;
        };
        this.clearTimer = function() {
            window.clearTimeout(this.timeoutObject);
        };
        this.setTimer = function(time) {
            var timer = this;
            if(typeof this.action != 'function') {return;}
            if(isNaN(time)) {time = this.intervalTime;}
            this.remaining = time;
            this.last = new Date();
            this.clearTimer();
            this.timeoutObject = window.setTimeout(function() {timer.go();}, time);
        };
        this.go = function() {
            if(this.isActive) {
                this.action();
                this.setTimer();
            }
        };

        if(this.init) {
            return new $.timer(func, time, autostart);
        } else {
            this.set(func, time, autostart);
            return this;
        }
    };
})(jQuery);

部分的 class.game.php

/**
    * Purpose: end the game
    * Preconditions: turns on the game over flag
    * Postconditions: game over flag is true
    **/
    function end()
    {
        $this->over = true;
    }

/**
    * Purpose: return bool to indiciate whether or not the game is over
    * Preconditions: none
    * Postconditions: returns true or flase
    **/
    function isOver()
        {
            if ($this->won)
                return true;

            if ($this->over)
                return true;

            if ($this->health < 0) 
                return true;

            return false;
        }

何时

timerComplete（）;

在demo.js中触发我想触发函数

端（）

在class.game.php中

，我该如何做到这一点？

Answer 1

这是一个快速的AJAX示例。

<强> demo.js

timerComplete = function() {
    alert('Example 2: Countdown timer complete!');
    sendAjax();
}

function sendAjax()
{
  if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
  }
  else
  {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function()
  {
    if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
      if(xmlhttp.responseText.match("success")){
          alert("AJAX returns success");
      }else{
          // something bad heppened
      }
    }
  }
  xmlhttp.open("GET","class.game.php?isTimerComplete=1",true);
  xmlhttp.send();
}

<强> class.game.php

if(isset($_GET["isTimerComplete"])==true)
{
    // Do additional sanitizations here,
    // e.g. http://www.w3schools.com/php/php_form_validation.asp
    $isTimerComplete=$_GET["isTimerComplete"];
    if($isTimerComplete){
        echo "success";
        yourFunction(); // function that set an php bool to true
    }
}

请访问AJAX Tutorial等网站。

或谷歌类似＆＃34; Ajax php示例＆＃34; 以了解有关AJAX及其与php文件交互的更多信息。

Answer 2

只是为了补充@ user2875289的答案，如果您的网页上已经有jquery，为什么不使用它，只需在javascript中执行此操作：

timerComplete = function() {
    alert('Example 2: Countdown timer complete!');
    callPHPMethod("class.game.php?isTimerComplete=1", function(returnedPHPfunctionValue){
         // it was success, now you can do something with returnedPHPfunctionValue
    });
}

function callPHPMethod(method, callback)
{
  $.ajax({
        url: method,
        method: "GET",
        success: function(data){
              if($.isFunction(callback)) callback(data)
        },
        error: function(){
              //do something with error
        }
  });

在你的PHP中，按@ user2875289指向：

if(isset($_SESSION["isTimerComplete"]) != true)
{
    // Do additional sanitizations here
    $isTimerComplete=$_GET["isTimerComplete"];
    //
    if($isTimerComplete){
        echo "success";
        yourPHPFunction(); // function that set an php bool to true
    }
}

如何从.js脚本事件触发PHP函数？

2 个答案: