Vecchie versioni di IE fatevi avanti!!

**carlomarx** · 17-07-2011, 20:03

Ciao a tutt*,
vorrei chiedere un favore a tutto il forum. C'è qualcuno che ha una vecchia versione di IE (anche molto vecchia) installata sul proprio PC? Sto cercando di testare un codice di compatibilità dei metodi DOM element.addEventListener e element.removeEventListener con browser Microsoft che non supportano neppure i metodi element.attachEvent e element.detachEvent introdotti con le ultime versioni di IE. Si tratta semplicemente di aprire questa pagina che incollo di seguito con un vecchio browser di IE e cliccare sul testo "Clicca qui!". Se non succede nulla vuol dire semplicemente che non funziona

Vi pregherei però, se vi va, di postare anche il tipo di errore riscontrato dal browser. Ovviamente specificate anche la versione di IE che state usando! Non vi costa nulla, solo qualche secondo

Grazie in anticipo

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Codice di compatibilit&amp;agrave; addEventListener</title>
<script type="text/javascript">
if (!Element.prototype.addEventListener) {
	var oListeners = {};
	function runListeners(oEvent) {
		if (!oEvent) { oEvent = window.event; }
		for (var iLstId = 0, iElId = 0, oEvtListeners = oListeners[oEvent.type]; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) {
				for (iLstId; iLstId < oEvtListeners.aEvts[iElId].length; iLstId++) { oEvtListeners.aEvts[iElId][iLstId].call(this, oEvent); }
				break;
			}
		}
	}
	Element.prototype.addEventListener = function (sEventType, fListener /*, useCapture (will be ignored) */) {
		if (oListeners.hasOwnProperty(sEventType)) {
			var oEvtListeners = oListeners[sEventType];
			for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
				if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
			}
			if (nElIdx === -1) {
				oEvtListeners.aEls.push(this);
				oEvtListeners.aEvts.push([fListener]);
				this["on" + sEventType] = runListeners;
			} else {
				for (var iLstId = 0, aElListeners = oEvtListeners.aEvts[nElIdx]; iLstId < aElListeners.length; iLstId++) {
					if (aElListeners[iLstId] === fListener) { return; }
				}
				oEvtListeners.aEvts[nElIdx].push(fListener);
			}
		} else {
			oListeners[sEventType] = { aEls: [this], aEvts: [ [fListener] ] };
			this["on" + sEventType] = runListeners;
		}
	};
	Element.prototype.removeEventListener = function (sEventType, fListener /*, useCapture (will be ignored) */) {
		if (!oListeners.hasOwnProperty(sEventType)) { return; }
		var oEvtListeners = oListeners[sEventType];
		for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
		}
		if (nElIdx === -1) { return; }
		for (var iLstId = 0, aElListeners = oEvtListeners.aEvts[nElIdx]; iLstId < aElListeners.length; iLstId++) {
			if (aElListeners[iLstId] === fListener) { aElListeners.splice(iLstId, 1); }
		}
	};
}
</script>
</head>

<body>


<span id="cliccami" style="cursor:pointer;color:#0000ff;text-decoration:underline;">Clicca qui!</span></p>
<script type="text/javascript">
var oElemento = document.all ? document.all.cliccami : document.getElementById("cliccami");

function prova1() {
	alert("Prova numero 1 riuscita!!");
}

function prova2() {
	alert("Prova numero 2 riuscita!!");
}

oElemento.addEventListener("click", prova1, false);
oElemento.addEventListener("click", prova2, false);
oElemento.removeEventListener("click", prova2, false);
oElemento.addEventListener("click", prova2, false);
</script>
</body>
</html>

P.S. Se non funziona, prima di postare l'errore, potreste riprovare anche sostituendo tutte le occorrenze di "Element.prototype" con "Object.prototype"? Basta cliccare su sostituisci nel proprio editor di testo… Thnx.

**carlomarx** · 17-07-2011, 21:41

Altrimenti potete andare su questo link:

http://tinyurl.com/637jq93

Ma trattandosi di un link codificato col data uri scheme non so se funzionerà con le vecchie versioni di IE... meglio fare copia incolla della pagina che ho postato…

**carlomarx** · 18-07-2011, 13:52

Mando alcune piccole correzioni…

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Codice di compatibilit&amp;agrave; addEventListener</title>
<script type="text/javascript">
var oElConstr = Element || Object;
if (!oElConstr.prototype.addEventListener) {
	var oListeners = {};
	function runListeners(oEvent) {
		if (!oEvent) { oEvent = window.event; }
		for (var iLstId = 0, iElId = 0, oEvtListeners = oListeners[oEvent.type]; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) {
				for (iLstId; iLstId < oEvtListeners.aEvts[iElId].length; iLstId++) { oEvtListeners.aEvts[iElId][iLstId].call(this, oEvent); }
				break;
			}
		}
	}
	oElConstr.prototype.addEventListener = function (sEventType, fListener /*, useCapture (will be ignored!) */) {
		if (oListeners.hasOwnProperty(sEventType)) {
			var oEvtListeners = oListeners[sEventType];
			for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
				if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
			}
			if (nElIdx === -1) {
				oEvtListeners.aEls.push(this);
				oEvtListeners.aEvts.push([fListener]);
				this["on" + sEventType] = runListeners;
			} else {
				var aElListeners = oEvtListeners.aEvts[nElIdx];
				if (this["on" + sEventType] !== runListeners) {
					aElListeners.splice(0);
					this["on" + sEventType] = runListeners;
				}
				for (var iLstId = 0; iLstId < aElListeners.length; iLstId++) {
					if (aElListeners[iLstId] === fListener) { return; }
				}			
				aElListeners.push(fListener);
			}
		} else {
			oListeners[sEventType] = { aEls: [this], aEvts: [ [fListener] ] };
			this["on" + sEventType] = runListeners;
		}
	};
	oElConstr.prototype.removeEventListener = function (sEventType, fListener /*, useCapture (will be ignored!) */) {
		if (!oListeners.hasOwnProperty(sEventType)) { return; }
		var oEvtListeners = oListeners[sEventType];
		for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
		}
		if (nElIdx === -1) { return; }
		for (var iLstId = 0, aElListeners = oEvtListeners.aEvts[nElIdx]; iLstId < aElListeners.length; iLstId++) {
			if (aElListeners[iLstId] === fListener) { aElListeners.splice(iLstId, 1); }
		}
	};
}
</script>
</head>

<body>


<span id="cliccami" style="cursor:pointer;color:#0000ff;text-decoration:underline;">Clicca qui!</span></p>
<script type="text/javascript">
var oElemento = document.all ? document.all.cliccami : document.getElementById("cliccami");

function prova1() {
	alert("Prova numero 1 riuscita!!");
}

function prova2() {
	alert("Prova numero 2 riuscita!!");
}

oElemento.addEventListener("click", prova1, false);
oElemento.addEventListener("click", prova2, false);
oElemento.removeEventListener("click", prova2, false);
oElemento.addEventListener("click", prova2, false);
</script>
</body>
</html>

**carlomarx** · 20-07-2011, 14:03

Proprio nessun@ che voglia fare il test? Vanno bene anche versioni non vecchissime di IE, così almeno mettiamo alcuni punti fermi…

**Portabile84** · 20-07-2011, 14:20

IE 5, IE 8
ci clicco e non accade nulla

IE 6, IE 7

Line 7, Char 1, 'Element' is undefined, Code 0 ... Do you want to continue running scripts on this page?

Line 67, Char 1, Object doesn't support this property or method, Code 0 ... Do you want to continue running scripts on this page?
Cliccando sia su si che su no, per bloccare/continuare ad eseguire lo script, anche se clicco su "clicca qui non succede nulla".

IE 9
clicco e mi escono due alert...
Prova numero 1 riuscita!! Prova numero 2 riuscita!!

Piccola nota: stai sfruttando l'html5 giusto?
Questo già con IE9 ha dei problemi di compatibilità...

**carlomarx** · 20-07-2011, 14:26

Grazie mille per il test, davvero! Ma se ti dà 'Element' is undefined probabilmente stai usando la prima versione! Usa la seconda, oppure usa la prima sostituendo tutte le tre occorrenze di Element (maiuscolo!) con Object. Thnx

P.S. Non c'entra HTML, né 5 né altro. È solo normalissimo javascript (e non sfrutto neanche introduzioni recenti...)

**carlomarx** · 20-07-2011, 14:31

Magari con IE 5-6 usa questa:

codice:

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Codice di compatibilit&amp;agrave; addEventListener</title>
<script type="text/javascript">
if (!Object.prototype.addEventListener) {
	var oListeners = {};
	function runListeners(oEvent) {
		if (!oEvent) { oEvent = window.event; }
		for (var iLstId = 0, iElId = 0, oEvtListeners = oListeners[oEvent.type]; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) {
				for (iLstId; iLstId < oEvtListeners.aEvts[iElId].length; iLstId++) { oEvtListeners.aEvts[iElId][iLstId].call(this, oEvent); }
				break;
			}
		}
	}
	Object.prototype.addEventListener = function (sEventType, fListener /*, useCapture (will be ignored!) */) {
		if (oListeners.hasOwnProperty(sEventType)) {
			var oEvtListeners = oListeners[sEventType];
			for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
				if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
			}
			if (nElIdx === -1) {
				oEvtListeners.aEls.push(this);
				oEvtListeners.aEvts.push([fListener]);
				this["on" + sEventType] = runListeners;
			} else {
				var aElListeners = oEvtListeners.aEvts[nElIdx];
				if (this["on" + sEventType] !== runListeners) {
					aElListeners.splice(0);
					this["on" + sEventType] = runListeners;
				}
				for (var iLstId = 0; iLstId < aElListeners.length; iLstId++) {
					if (aElListeners[iLstId] === fListener) { return; }
				}			
				aElListeners.push(fListener);
			}
		} else {
			oListeners[sEventType] = { aEls: [this], aEvts: [ [fListener] ] };
			this["on" + sEventType] = runListeners;
		}
	};
	Object.prototype.removeEventListener = function (sEventType, fListener /*, useCapture (will be ignored!) */) {
		if (!oListeners.hasOwnProperty(sEventType)) { return; }
		var oEvtListeners = oListeners[sEventType];
		for (var nElIdx = -1, iElId = 0; iElId < oEvtListeners.aEls.length; iElId++) {
			if (oEvtListeners.aEls[iElId] === this) { nElIdx = iElId; break; }
		}
		if (nElIdx === -1) { return; }
		for (var iLstId = 0, aElListeners = oEvtListeners.aEvts[nElIdx]; iLstId < aElListeners.length; iLstId++) {
			if (aElListeners[iLstId] === fListener) { aElListeners.splice(iLstId, 1); }
		}
	};
}
</script>
</head>

<body>


<span id="cliccami" style="cursor:pointer;color:#0000ff;text-decoration:underline;">Clicca qui!</span></p>
<script type="text/javascript">
var oElemento = document.all ? document.all.cliccami : document.getElementById("cliccami");

function prova1() {
	alert("Prova numero 1 riuscita!!");
}

function prova2() {
	alert("Prova numero 2 riuscita!!");
}

oElemento.addEventListener("click", prova1, false);
oElemento.addEventListener("click", prova2, false);
oElemento.removeEventListener("click", prova2, false);
oElemento.addEventListener("click", prova2, false);
</script>
</body>
</html>

**Portabile84** · 20-07-2011, 16:01

Stessa cosa con l'ultimo codice che hai indicato...

Ho detto dell'html5 solo per sentito dire... non mi sono ancora lanciato nel suo uso visto che comunque è ancora in fase di studio...

**DeMoN3** · 29-07-2011, 17:19

carlomarx, ma non ti conviene installarti IETester?

Discussione: Vecchie versioni di IE fatevi avanti!!

Strumenti discussione

Ricerca discussione

Visualizza

Vecchie versioni di IE fatevi avanti!!

Permessi di invio