顯示KineticJs文本的值（）

Question

我想改變我的容器中的文本使用jquery中的keyup事件，但它不顯示。我試圖獲得該值，然後將其顯示在span元素上，並且工作正常。 這裏是我的代碼：

var stage = new Kinetic.Stage({ 
     container: 'canvasContainer', 
     width: 800, 
     height: 800 
    }); 
    var layer = new Kinetic.Layer(); 
    var message = ''; 

    $(function(){ 
     $('#txtArea').change(function(){ 
      message = $(this).val(); 
      $('.output').text(message); 

      var simpleText = new Kinetic.Text({ 
       x: 0, 
       y: 10, 
       text: message, 
       fontSize: 30, 
       fontFamily: 'Calibri', 
       fill: 'blue' 
      }); 
      layer.add(simpleText); 
     }).keyup(function(){ 
      $(this).change(); 
     }); 
    }); 
    stage.add(layer); 

Answer 1

在您添加或更改動力學對象，一定要調用layer.draw（），使繪圖可見。

BTW，而不是添加新的SimpleText每次更改，您可能希望只是改變現有文本對象的文本

// declare simpleText before .change() 

var simpleText = new Kinetic.Text({ 
    x: 0, 
    y: 10, 
    text: "", 
    fontSize: 30, 
    fontFamily: 'Calibri', 
    fill: 'blue' 
}); 
layer.add(simpleText); 

// then inside .change() 

simpleText.setText(message); 
layer.draw();