< !DOCTYPE html >
< html >
< body >
< canvas id = "myCanvas"
width = "800"
height = "450"
style = "border:1px solid #d3d3d3;" >
< /canvas>
< function >
blueCircle.addEventListener("click", getClickPosition, false);
function getClickPosition(e) {
var xPosition = e.clientX;
var yPosition = e.clientY;
}
< script >
var myimgobj = document.images["jsbutton"];
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.arc(300, 400, 40, 0, 6 * Math.PI);
ctx.stroke();
ctx.fillStyle = '#AFEEEE';
ctx.fill();
ctx.stroke();
ctx.strokeStyle = "#F0E68C";
ctx.lineWidth = 5;
ctx.stroke();
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.fillRect(100, 100, 400, 40);
ctx.stroke();
ctx.fillStyle = '#AFEEEE';
ctx.fill();
ctx.stroke();
ctx.strokeStyle = "#F0E68C";
ctx.lineWidth = 5;
ctx.stroke();
< /script>
< p > This example uses the HTML DOM to assign an "onclick"
event to a p element. < /p>
< p id = "demo" > SEND. < /p>
< script >
document.getElementById("demo").onclick = function() {
myFunction()
};
function myFunction() {
document.getElementById("demo").innerHTML = "SENT TO SERVER!";
}
< /script>
< /body> < /html>