Question

我使用创建js将Flash文件转换为html5，但动作脚本无法正常工作，我想在文本框ans_txt1和ans_txt中添加值。和文本应重点放在click上。代码的方式和作用是什么？

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>CreateJS export from 
E313ST01MT01_Comparison_Near_farther_activity</title>  
<script src="http://code.createjs.com/easeljs-0.6.0.min.js"></script>
<script src="http://code.createjs.com/tweenjs-0.4.0.min.js"></script>
<script src="http://code.createjs.com/movieclip-0.6.0.min.js"></script>    
<script src="http://code.createjs.com/preloadjs-0.3.0.min.js"></script>    
<script src="http://code.createjs.com/soundjs-0.4.0.min.js"></script>    
<script src="../../Copy of wt/E313ST01MT01_Comparison_Near_farther_activity.js"></script>    
<script>    
(function (lib, img, cjs) {    
var p; // shortcut to reference prototypes    
var rect; // used to reference frame bounds    
// stage content:    
(lib.E313ST01MT01_Comparison_Near_farther_activity = function(mode,startPosition,loop) {
    this.initialize(mode,startPosition,loop,{});

    // top-gui

    this.instance = new lib.topguiA();

    this.timeline.addTween(cjs.Tween.get({}).to({state:[{t:this.instance}]}).wait(164));

    // btns

    this.pre_btn = new lib.pre45();
    this.pre_btn.setTransform(654.5,490.4,0.662,0.662);

    this.pre_btn.shadow = new cjs.Shadow("#000000",0,0,5);

    new cjs.ButtonHelper(this.pre_btn, 0, 1, 2, false, new lib.pre45(), 3);


    this.next_btn = new lib.next45();

    this.next_btn.setTransform(676.6,461.8,0.662,0.662);
    this.next_btn.shadow = new cjs.Shadow("#000000",0,0,5);

    new cjs.ButtonHelper(this.next_btn, 0, 1, 2, false, new lib.next45(), 3);


    this.timeline.addTween(cjs.Tween.get({}).to({state:[{t:this.next_btn},
{t:this.pre_btn}]}).wait(164));

    // wrong dis
    this.dis2_mc = new lib.S4555x();
    this.dis2_mc.setTransform(412.4,418.3,0.77,1.001,0,0,0,-28.2,33.5);

    this.dis1_mc = new lib._4985x();

    this.dis1_mc.setTransform(242,319.4,0.77,1.001,0,0,0,-28.2,33.5);

    this.timeline.addTween(cjs.Tween.get({}).to({state:[]}).to({state:[{t:this.dis1_mc},{t:this.dis2_mc}]},160).wait(4));

    // wrong
    this.wr2_mc = new lib.wrong();

    this.wr2_mc.setTransform(413.2,381.1,2.21,2.214,0,0,0,15.8,11.1);

    this.wr1_mc = new lib.wrong();

    this.wr1_mc.setTransform(243.7,276.9,2.21,2.214,0,0,0,15.8,11.1);

    this.timeline.addTween(cjs.Tween.get({}).to({state:[]}).to({state:[{t:this.wr1_mc},{t:this.wr2_mc}]},160).wait(4));

    // side mc

    this.sd_mc = new lib.gg();

    this.sd_mc.setTransform(875,122);
    this.sd_mc._off = true;

    this.timeline.addTween(cjs.Tween.get(this.sd_mc).wait(160).to({_off:false},0).wait(4));

    // ansfields

    this.ans2_txt = new cjs.Text("", "bold 35px TektonPro-Bold", "#FFFFFF");

    this.ans2_txt.textAlign = "center";

    this.ans2_txt.lineHeight = 37;

    this.ans2_txt.lineWidth = 39;

    this.ans2_txt.setTransform(411.1,357.9);


    this.ans1_txt = new cjs.Text("", "bold 35px TektonPro-Bold", "#FFFFFF");

    this.ans1_txt.textAlign = "center";

    this.ans1_txt.lineHeight = 37;

    this.ans1_txt.lineWidth = 36;

    this.ans1_txt.setTransform(241.6,253.7);

    this.ans1_txt.id= 2;

    this.ans1_txt.mouseEnabled="true";

    this.ans1_txt.onclick="focus()"

// Layer 13

    this.an_mc = new lib.welldoneg();

    this.an_mc.setTransform(84.1,361.1,0.763,0.763,0,0,180,305.9,133.4);

    this.an_mc._off = true;


    this.timeline.addTween(cjs.Tween.get(this.an_mc).wait(40).to({_off:false},0).wait(1));

Answer 1

我认为，您正在询问制作可编辑文本，即Adobe Animate中的输入文本。

HTML5输出或CreateJS不支持此功能。在画布上输入文本是一件非常困难的事情，并且将具有超限支持，因为Canvas自己的文本实现非常差。

您可以使用HTML输入元素和EaselJS DOMElement class添加自己的支持，ZIMJS可以在舞台上方添加HTML内容，但被视为舞台的子元素。

如果您只想更改文本实例的文本，则非常简单：

exportRoot.ans1_txt.text = "New Text";

在单击时执行此操作将不起作用，因为您没有初始文本值，因此在单击阶段没有任何操作。

希望有帮助。您还可以查看运行在CreateJS上的Here's a working sample at DB-Fiddle，我相信它具有可编辑的文本控件。不确定它在Animate中的表现如何。

onclick专注于使用javascript创建js文本框

1 个答案: