Touch event is not working as expected

cocos2d-x JavaScript
#1

var AppsListLayer = cc.Layer.extend({

ctor: function() {
	this._super();	
	this.size = cc.winSize;

	var spr1 = new MySprite("res/game_list/game1.png", 160, 350);
	spr1.spr_name = 'game1';
	this.addChild(spr1);

	var spr2 = new MySprite("res/game_list/game2.png", 160, 150);
	spr2.spr_name = 'game2';
	this.addChild(spr2);
}

});

var MySprite = cc.Sprite.extend({

ctor: function(file, xLocation, yLocation) {
	this._super();

	this.initWithFile(file);
	this.setPosition(cc.p(xLocation, yLocation));
	cc.eventManager.addListener(objListener.clone(), this);
}

});

var objListener = cc.EventListener.create({
event: cc.EventListener.TOUCH_ONE_BY_ONE,
swallowTouches: true,
onTouchBegan: function (touch, event) {
	var target = event.getCurrentTarget();
	cc.log(target.spr_name);
	if(target.spr_name == "game1") {
		cc.director.pushScene(new Game1());
	}
}
});

When i click on the sprite, The output is
game1
game2

If i add return true to onTouchBegan, the output is always game2
Why?

#2

It seems like you’re expecting the touch handlers to get kicked off when you touch within the bounds of each Sprite, but that’s not how touch handlers work.

A touch handler is kicked off anytime you touch or click anywhere on the screen. Essentially, you’re adding two full-screen touch handlers, which is redundant.

What you most likely want to do is add a touch handler to your AppsListLayer that contains your two sprites. Then, when you receive a touch event in your onTouchBegan method, get the position of the touch and see if it’s within the bounds of one of your sprites.

The reason why onTouchBegan only outputs “game2” when you return true, is because when return true your touch handler “swallows” the touch and doesn’t allow the touch to propagate to any other touch handlers. Since you created the “game2” sprite last, it’s the first touch handler to receive events (kind of think of it like adding touch handlers to a stack, the last one added is the first to receive touches).

When you don’t return true, the touch is allowed to propagate to other touch handlers, and that’s why your second touch handler for the “game1” sprite is also called.