logo El diario de Pepe Molina (Caricatos)

yo

Veremos como podemos resolver un sudoku introduciendo los números por teclado.


Última caricatura

IV Asamblea de la AEC: IV Asamblea General de la Asociación Española de Caricaturistas

IV Asamblea de la AEC

RSS de las imágenes: rss


La Cita

Los sabios son los que buscan la sabiduría, los necios piensan ya haberla encontrado

Napoleón Bonaparte, emperador de Francia (1769-1821).


En esta zona están las páginas personales del autor.


Mis clientes ahora también son mis amigos (aunque les cobre).


En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..


En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)


Las recomendaciones que proponemos son de índole variada.


Aquí un cajón de sastre de enlaces.


Nos referencian desde sitios de toda índole.


Puede contribuir a mantener esta página con su donativo.


botón pay-pal

SVG interactivo: sudokus

emoticón de Caricatos Publicado el día 09 de febrero de 2013
id=115; categorías: Vicisitudes de un Webmaster, Mentes pensantes, Globalización, Programación

Veremos como podemos resolver un sudoku introduciendo los números por teclado. No intentaremos resolverlo con código, ya que nuestra intención es otra: la interacción.

Podemos escoger entre los sudokus en miniatura, o incluír cada número pulsando sobre cada casilla. En este caso no hacemos ninguna verificación.

Puede seleccionar una miniatura
sudoku alternativo sudoku alternativo sudoku alternativo sudoku alternativo

Algunos de los ejemplos los hemos visto ya en anteriores apuntes.

Eventos

Para responder a un evento hay que asociarlo de la misma forma que con cualquier elemento html. Hemos asignado un identificador "id" a cada casilla de forma que la primera tiene id="casilla_0_0" y la última : id="casilla_8_8"; y dentro de cada casilla tenemos un elemento "text" (texto) con similar identificador, reemplazando "casilla_" por "txt_":

function tag(id)	{return document.getElementById(id);}
function poner_evento(elemento, evento, f)	{
	if (document.addEventListener)
		elemento.addEventListener(evento, f, true);
	else
		if (document.attachEvent)
			elemento.attachEvent("on" + evento, f);
		else
			elemento["on" + evento] = f;
}
// De la inicialización de la página, nos interesan estas pocas líneas.
for (i = 0; i < 9; i++)	for (j = 0; j < 9; j++)	{
	tag("txt_" + i + "_" + j).appendChild(document.createTextNode(""));
	poner_evento(tag("casilla_" + i + "_" + j), "click", entrada);
}

Podemos resumir en estas pocas líneas que a cada casilla le asociamos al evento "click" (onclick) la función "entrada()" que mostramos a continuación:

function entrada() {
	id = this.id;
	coleta = id.substr(8);
	xy = coleta.split("_");
	n_actual = tag("txt_" + coleta).firstChild.data;
	n = prompt("nuevo valor para la casilla [" + xy + "] : ", n_actual)[0];
	if ("123456789".indexOf(n) != -1)	{
		sudoku = document.forms.form_sudoku.inicio.value;
		valores = sudoku.split("");
		posi = parseInt(xy[0]) * 9 + parseInt(xy[1]);
		valores[posi] = n;
		document.forms.form_sudoku.inicio.value = valores.join("");
		tag("txt_" + coleta).replaceChild(document.createTextNode(n), tag("txt_" + coleta).firstChild);
	}
}

Sobre este último código, solo reseñaremos que tanto la lectura como escritura de nodos de texto se hace de la misma manera que hemos hecho hasta el momento.

Zona de comentarios

Este apunte aún no tiene comentarios.

Evaluación

Valoración de esta página: (apunte.115) valor

Valoración evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar

Respuesta: Zona de mensajes (proceso de evaluación)

Historial de navegación

Esta página ha sido visitada en 2999 ocasiones


Disponemos de rss sindicar

Y del Mapa del sitio, además del sitemap.xml.


Aquí podemos encontrar los apuntes más visitados.

"Top 10" reemplaza a la sección Últimos apuntes.


Una buena forma de buscar un apunte es a partir de su categoría.


También es posible buscar apuntes por medio de las etiquetas (tags).


Hemos decidido poner al alcance de todos algunos comodines.

Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:

Buscar en apuntes

También estamos recopilando antiguas páginas del sitio.


Desde este recuadro se puede hacer una búsqueda cronológica.


Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..

../diario.imagen.php?id=2&max=480
enlace a la postal
Copyright © 2002-2018 www.pepemolina.com
RSS rss | Ver Mapa del sitio