JavaScript Programming

From Elvanör's Technical Wiki
Revision as of 13:10, 14 August 2007 by Elvanor (talk | contribs)
Jump to navigation Jump to search

The best documentation on JavaScript available on the Internet is the one on the Mozilla development center. All the other sources are just not worthy and full of errors.

Hints and Tips

  • Deleting options in a select element (in a form):
document.my_form.my_select.options[index] = null;

Note that this syntax probably also works for other arrays of objects (untested yet, though).

  • Outputting quickly (for debugging) an array:
alert(my_array);

will display all the elements of the array, separated by commas.

  • Clickable link, calling some JS code:
<a href="page_no_JS.html" onclick="javascript:doSomething(); return false;"> ?

This works very well if you have two versions of your site. This will hide the JavaScript code in the status bar in Firefox, which is much better.

Preloading Images

  • Note that once an image is preloaded, you must attach it to the document somehow. Else it seems Firefox can somehow 'forget' it, and it will be fetched again, thus you lose the benefits of preloading.
  • Sample code for preloading (this uses Prototype):
function preloadNormalImages(url_array)
{
	url_array.each(function(url)
	{
		var normal_image = new Image;
		normal_image.onload = function() { $(image_preload).setAttribute("src", url); };
		normal_image.src = url;
	});
}

JavaScript Libraries

  • FCKeditor: a rich text editor that can be integrated into any web page. Integration is really easy, at least for a PHP environment.
    • Warning: due to a strange encoding of the source files on the package, it seems some UTF BOM characters are present. This causes some weird character output when using PHP integration (at least, untested with other environments). Remove these strange characters from the PHP integration files (fckeditor.php and all).
    • By default, FCKeditor converts the latin characters directly to HTML entities (eg, é is converted to &eacute;). To disable that, set IncludeLatinEntities to false in the configuration (the file fckconfig.js).
FCKConfig.ProcessHTMLEntities	= true ;
FCKConfig.IncludeLatinEntities	= false ;
FCKConfig.IncludeGreekEntities	= false ;

Prototype

  • Binding is one of the most useful functions in Prototype. In particular, when iterating over objects with an each and a defined function, the function won't be binded to the current object. You must manually bind it.