Question

假设我的HTML5文档中有canvas标记

<canvas id="fooBar" width="500" height="200"></canvas>

我还有一个空的锚标记

<a href="" id="spin">Spin</a>

我在头部构建我的画布

var fooCanvas = document.getElementById("fooBar");
var barContext = fooCanvas.getContext("2d");

有没有办法可以添加：

barContext.fillText("fubar", x,y);

通过点击锚标签动态地？我想要的是在我的JS中有一个变量并不总是保持相同的值，并且每次单击链接时单击a标签将更新canvas fillText属性。我想要克服这个问题是使用jQuery并且有像这样的东西：

    $(document).ready(function(){
        $("a").click(function(event){
            // Something here
        });
    });

显然这会对我在文档中的每个标记都有效，所以我稍后会指定但是我不太确定将canvas属性附加到画布所需的语法？有什么想法吗？

Answer 1

是：

var fooCanvas = document.getElementById("fooBar");
var barContext = fooCanvas.getContext("2d");

$(document).ready(function(){
    $("a").click(function(event){
        barContext.fillText("fubar", x,y);
    });
});

虽然您可能希望使用button元素而不是a，因为它们实际上不是链接。

动态添加画布属性？

1 个答案: