0

これは私のデモjsFiddle です

HTML

<canvas id="random"></canvas>

jQuery

function Random() {
    var length = 9,
        charset = "ABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789",
        retVal = "";
    for (var i = 0, n = charset.length; i < length; ++i) {
        retVal += charset.charAt(Math.floor(Math.random() * n));
    }
    return retVal;
}
var ctx = document.getElementById("random").getContext('2d');
ctx.font = "30px Codystar";
ctx.fillText(Random(), 30, 30);
$("#random").click(function () {
    ctx.fillText(Random(), 30, 30);
});

私の質問 1-フォントが最初の起動時に機能せず、2-クリック機能が機能しませんか?

4

2 に答える 2

1

clearRect(x,y, w, h);再度書き込む前に、関数を使用してキャンバスをクリアする必要があるようです。

何かのようなもの：

$("#random").click(function () {
    ctx.clearRect ( 0,0,1000,1000 );
    ctx.fillText(Random(), 30, 30);
});

リビングデモ: http://jsfiddle.net/vEEPS/3/

于 2013-08-22T09:14:21.333 に答える
0

次のリンクをたどりました

キャンバス上のクリック機能を理解するのに役立つことがわかりました。

于 2013-08-22T09:11:17.617 に答える