Přidání událostí do Přidání událostí v jQuery

Začátkem tohoto týdne jsem zveřejnil tip na použitelnost týkající se použití vlastních událostí CSS a MooTools k automatickému přidání kurzoru „ukazatele“, když je k prvku připojena událost „kliknutí“. Obdržel jsem mnoho žádostí o verzi jQuery a myslím, že jsem přišel na to, jak tuto funkci replikovat.

Zobrazit ukázku

Selhání JavaScriptu jQuery

/* create custom event */
jQuery.event.special.click = {
	 setup: function() {
		  $(this).css('cursor','pointer');
	 },
	 teardown: function(namespaces) {
		  $(this).css('cursor','');
	 }
};
/* usage; nothing different than usual*/
$(document).ready(function() {
	$('#click-me').click(function() {
		var col = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
		$(this).css('background',col);
	});
});

Objekt speciální události používám k přidání vlastní události s názvem click. Po přidání události způsob nastavení změní kurzor prvku na ukazatel. Pokud bychom tuto událost odstranili, kurzor ukazatele by byl odstraněn. Problém s výše uvedeným kódem je v tom, že se zdá, že přepisuje výchozí událost kliknutí, a když na prvek skutečně kliknete, nic se nestane. Sakra!

Úspěch JavaScriptu jQuery

/* listen for hover/click */
$(document).ready(function() {
	/* attempt fix */
	$('*').each(function() {
		$(this).mouseover(function() {
				if(jQuery.data(this,'events').click) {
					$(this).css('cursor','pointer');
				}
		});
	});
	/* usage? */
	$('#click-me').click(function() {
		var col = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';
		$('#click-me').css('background',col);
	});
});

Jediný způsob, jak bych to mohl přimět, aby to fungovalo bez úpravy jádra jQuery, je umístit událost mouseenter na každý prvek v DOM, který zkontroloval, zda je pro daný prvek přítomna událost kliknutí. Pokud ano, ukažte kurzor. Toto je ošklivá metoda k dosažení cíle, ale jediná, kterou jsem našel. Pokud by měl být prvek přidán do DOM dynamicky, výše uvedené by nefungovalo.

AKTUALIZACE:Řešení jQuery JavaScript

jQuery.event.special.click = {
    setup: function() {
        $(this).css('cursor','pointer');
        return false;
    },
    teardown: fuction() {
        $(this).css('cursor','');
        return false;
    }
};

Brandon Aaron a Scott Kyle nám požehnali řešením; vypadá to, že jsem byl velmi blízko. Přidání return false; by to udělal.

Zobrazit ukázku

Děkuji Brandonovi a Scottovi, že mi pomohli!