您的位置：首页 > Web前端 > JavaScript

html5知识：Canvas的KineticJS事件委托！

2013-10-08 20:17 447 查看
获取事件的目标与KineticJS,我们可以访问targetNode的事件对象。这是特别有用,当使用事件委托,我们可以绑定一个事件处理程序来一个父节点,并听其孩子发生的事件。

说明:点击星形状和观察到层事件绑定正确识别形状,被点击。



<!DOCTYPE HTML>
<html>
<head>
<style>
body {
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="container"></div>
<script src="http://d3lp1msu2r81bx.cloudfront.net/kjs/js/lib/kinetic-v4.7.2.min.js"></script>
<script defer="defer">
var stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 200
});
var layer = new Kinetic.Layer();

var star = new Kinetic.Star({
x: stage.getWidth() / 2,
y: stage.getHeight() / 2,
numPoints: 15,
innerRadius: 40,
outerRadius: 70,
fill: 'blue',
scale: {
x: 2,
y: 0.5
},
name: 'my star'
});

layer.on('click', function(evt) {
// get the shape that was clicked on
var shape = evt.targetNode;
alert('you clicked on \"' + shape.getName() + '\"');
});

layer.add(star);
stage.add(layer);
</script>
</body>
</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签：  Canvas的KineticJS事件委托
相关文章推荐
新的分享
章节导航