Phaser游戏框架与HTML Dom元素之间的通信交互

xiaowugui666 发布于2019-08-30 15:55 / 2485人阅读

摘要：本想按照的元素官方实例来创建元素，但一直提示错误，无奈直接用的语法来创建元素，然后在内获取该元素，也不用再使用第三方的插件，还是挺方便快捷的。按照这个思路，还可以创建等一系列元素，然后再在内操作其对应的就可以了，而至于元素则用监听即可。

本想按照PHASER的HTML Dom元素官方实例：http://labs.phaser.io/index.h... Canvas来创建HTML DOM元素，但this.add.dom 一直提示错误，无奈直接用HTML5的语法来创建DOM元素，然后在Phaser内获取该DOM元素，也不用再使用第三方的Phaser Html Input插件Plugin，还是挺方便快捷的。

按照这个思路，还可以创建listView,ScrollView等一系列HTML Dom元素，然后再在Phaser内操作其对应的div ID就可以了，而至于BUTTON元素则用addEventListerner监听即可。

HTML代码

PHASER 代码

 //MARK:-- create element
    createBetElement: function () {
        document.getElementById("gameBetZone").style.display = "none"; // block
        document.getElementById("rowBet").style.display = "block";
        document.getElementById("rowSearching").style.display = "none";
    }

// 取得输入框 amount的值
this.amountEle = document.getElementById("amount");
this.betButton = document.getElementById("betButton");
me.betButton.addEventListener("click", myClickEvent, false);
function myClickEvent() {
           
            // REMOVE EXISTING BUTTON EVENT;
            me.betButton.removeEventListener("click", myClickEvent, false);
            //TODO:sending this value to server;
            console.log("me.amountEle.value$", me.amountEle.value);
          
        }

更多游戏教程：www.iFIERO.com -- 为游戏开发深感自豪

云服务器 GPU云服务器大数据与共享经济之间的联系 html5与js交互 html5元素与标签 DOM交互操作

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/117160.html

Phaser游戏框架与HTML Dom元素之间的通信交互

摘要：本想按照的元素官方实例来创建元素，但一直提示错误，无奈直接用的语法来创建元素，然后在内获取该元素，也不用再使用第三方的插件，还是挺方便快捷的。按照这个思路，还可以创建等一系列元素，然后再在内操作其对应的就可以了，而至于元素则用监听即可。本想按照PHASER的HTML Dom元素官方实例：http://labs.phaser.io/index.h... Canvas来创建HTML DO...

Neilyo 2019-08-02 14:00 评论0 收藏0
游戏开发

摘要：工欲善其事必先利其器游戏环境对比发表算法在游戏上超过人类之后，游戏研究迅速成为了研究热点。当然这不是网络游戏服务器架构概述一架构模型现代电子游戏，基本上都会使用一定的网络功能。每个程序员都需要知道一些游戏网络知识本文主要针对游戏的网络设计，在文章中目前主流的网络游戏实现方案都有讲解。从Peer-to-Peer 帧同步，客户端/服务器（c/s架构），客户端预测（Client-Side...

Enlightenment 2019-08-21 18:45 评论0 收藏0