Konstantin Vlasenko

An engineer is someone who can make for a dollar what any fool could make for two. – Alan Kay

Tag Archives: JavaScript

#jQuery. Use the .delegate() instead of .live(). Use .on() instead of .delegate()

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

When a selector is provided (.on), the event handler is referred to as delegated. The handler is not called when the event occurs directly on the bound element, but only for descendants (inner elements) that match the selector.

Advantage of event delegation is that any children added dinamically to the element whould still have the event listener.

 

 

[express/connect.static] Set ‘Last-Modified’ to now to avoid 304 Not Modified

Why do I need this? The right answer is: I don’t need that trick!

The example below is just to show how to use routes to intercept requests to a static file.

Put router before static.

app.use(app.router);
app.use(express.static(__dirname + '/static'));

Add ‘/*’ handler (don’t forget to call next())

app.get('/*', function(req, res, next){ 
  res.setHeader('Last-Modified', (new Date()).toUTCString());
  next(); 
});

HTML5 chessboard

<html>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
	// draws a chessboard
	function drawChessboard() {
		// define the constants
		var baseX = 0.5, baseY = 0.5, width = 50;
		// get the 2D context from the "chessboard" canvas
		var context = document.getElementById("chessboardCanvas").getContext("2d");

		// draws the 8 by 8 chessboard
		for (var i = 0; i < 8; i++) {
			for (var j = 0; j < 8; j++) {
				var x = baseX + width * i, y = baseY + width * j;

				// draw the rectangle
				context.strokeRect(x, y, width, width);

				// fill the odd number rectangles
				if ((i + j) % 2 != 0) {
					context.fillRect(x, y, width, width);
				}
			}
		}
	}
	drawChessboard();
});
</script>
</head>
<body>
<canvas id="chessboardCanvas" width="401" height="401" class="block"/>
</body>

</html>
Follow

Get every new post delivered to your Inbox.