小编Cal*_*vin的帖子

可以更改画布的大小(宽度和高度),但不能动态更改画布的样式大小.

canvas = document.getElementById('test_fabric');
ctx = this.canvas.getContext('2d');
canvas.style.width = 1000;  // does not work.
canvas.style.height = 260;  // does not work.
canvas.width = 100;  // works.
canvas.height = 100;  // works.

canvas.width和canvas.height都运行良好,但canvas.style.width和canvas.style.height都不起作用.

在我的例子中,画布的样式大小只能通过css文件或画布的内联样式来更改.

canvas#test_fabric {
  width:400px;
  height:400px;
  background:gold;
}

要么

<div><canvas id="test_fabric" width="200" height="200" 
style="width:200px; height:200px"></canvas></div>

注意:当内联样式存在时,css文件将无效.

有什么方法可以通过JavaScript动态地更改画布的样式大小？

提前致谢!

遵循 ember.js 2.3.0 指南的示例， EMBER.TEMPLATES.HELPERS CLASS

export default Ember.Component.extend({
  actions: {
    // Usage {{input on-input=(action (action 'setName' model) value="target.value")}}
    setName(model, name) {
      model.set('name', name);
    }
  }
});

我写我的代码如下：

模板.hbs

<div>
{{input type='text' id='Txt01' value='firstName'
  on-input=(action "onInput")
  key-press=(action "onKeyPress")
  key-down=(action "onKeyDown")
  key-up=(action "onKeyUp")
  change=(action "onChange")}}
</div>

控制器.js

export default Ember.Controller.extend({
  actions: {
    onKeyPress() {
      console.log('Text-Key-Pressed');
    },
    onKeyDown() {
      console.log('Text-Key-Down');
    },
    onKeyUp() {
      console.log('Text-Key-Up');
    },
    onInput() {
      var value = Ember.$('#Txt01').val();
      console.log('onInput:' + value);
    },
    onChange() {
      var value = Ember.$('#Txt01').val();
      console.log('onInput:' …