html圆圈点选择,如何用html5点击相应链接时用颜色填充圆圈

如何填写画布圈时的HTML链接被点击

这里一个灵活的功能，绘制一个圆圈，并可选择填充该圆圈：

function drawCircle(context,fill){

context.beginPath();

context.arc(55, 30, 20, 0, 2 * Math.PI);

context.closePath();

context.stroke();

if(fill){

context.fill()

}

}

jquery可以监听点击您的锚点。

然后用jQuery的填充调用画圆函数= TRUE(圈子充满)

// fill the circle on click

$("#c1").click(function(){ drawCircle(ctx,true); });

$("#c2").click(function(){ drawCircle(ctx1,true); });

body{ background-color: ivory; padding:20px; }

canvas{border:1px solid red;}

$(function(){

var canvas=document.getElementById("myCanvas");

var ctx=canvas.getContext("2d");

var canvas1=document.getElementById("myCanvas1");

var ctx1=canvas1.getContext("2d");

// draw stroked but not filled circles

drawCircle(ctx,false);

drawCircle(ctx1,false);

function drawCircle(context,fill){

context.beginPath();

context.arc(55, 30, 20, 0, 2 * Math.PI);

context.closePath();

context.stroke();

if(fill){

context.fill()

}

}

// fill the circle on click

$("#c1").click(function(){ drawCircle(ctx,true); });

$("#c2").click(function(){ drawCircle(ctx1,true); });

}); // end $(function(){});

Hello

Hi