0

我正在尝试使用 KineticJS，但遇到了麻烦：

好的，所以在我的 JavaScript 文件的顶部，我有以下小花絮： 

var cuin = '';
//...
var cuinShow = new Kinetic.Text({
 x: 320,
 y: 81,
 text: '',
 fontSize: 18,
 fontFamily: 'Lucida Bright',
 fill: 'black'
});

然后我有这个功能： 

function updateText(){
    cuinShow.setText(cuin);
    return current + getAction() + $.localStorage('difficulty') + " =";
}

经过测试，Chrome 告诉我它不喜欢我的代码： 

Uncaught TypeError: Cannot call method 'setText' of undefined

现在，我知道它可能与 的范围有关cuinShow，但我不知道是什么。此外，如果它意味着什么（我认为它不会，但以防万一），我已经将该脚本与 KineticJS 一起外部化了。这是html： 

<!DOCTYPE html>
<head><script src="jquery-1.10.2.min.js"></script>
    <script src="jquery.storage.js"></script></head>
<body>
    <div id="container"></div>
    <script src="kinetic-v4.5.4.min.js"></script>
    <script src="kgame.js" defer="defer"></script>
</body>

对此的任何帮助将不胜感激。

4

1 回答 1

1

就像 Divey 说的，这很可能是一个范围问题。

看看这个jsfiddle

当您将您提到的所有代码一个接一个地放在同一范围内时，该函数运行良好。

我的猜测是，var cuinShow它被声明为一个var无法访问的地方updateText()，就像在另一个不包含updateText().

尝试var从当前cuinShow声明中删除，然后var cuinShow在 JS 文件的全局范围（或​​顶部）声明外部。

编辑：

你定义了：

var ptext = new Kinetic.Text({
  x: 193.5,
  y: 84,
  text: updateText(),
  fontSize: 18,
  fontFamily: 'Lucida Bright',
  fill: 'black'
});

定义前：

var cuinShow = new Kinetic.Text({
  name: 'cuinShowName',
  x: 320,
  y: 81,
  text: '',
  fontSize: 18,
  fontFamily: 'Lucida Bright',
  fill: 'black'
});

因此 updateText() 在您声明时被调用ptext，但 cuinShow 尚未声明！这可以通过cuinShow在 ptext 之前声明来解决。

此外，您的updateText()函数有一些错误：

function updateText(){
  console.log(textLayer.get('cuinShow'));
  (textLayer.get('.cuinShowName')).each(setText(cuin));
  return current + getAction() + $.localStorage('difficulty') + " =";
}

它应该是这样的：

function updateText(){
  textLayer.get('.cuinShowName').each(function() {
    this.setText(cuin)
  });
  return current + getAction() + $.localStorage('difficulty') + " =";
}

setText()期望在它之前有一个对象，因此您需要this在函数内部使用each。

于 2013-07-10T18:08:39.247 回答