Aquí podría ser tu PUBLICIDAD


Cambiar el tipo de cursor para un documento html desde javascript

votos
5

Digamos que tengo un método de JavaScript que demora un poco en completarse sin ningún comentario del usuario. En mi caso, es ordenar las filas en un elemento de la tabla (todo en el DOM, solo lleva demasiado tiempo si hay muchas filas), pero podría hacer cualquier cosa. Quiero mostrar el cursor de progreso mientras se ejecuta. Esto es lo que tengo actualmente, pero también he intentado varias otras cosas:

// SORT   
document.body.style.cursor = progress;
MyLongRunningMethod(); //blocks for 10-15 seconds before returning
document.body.style.cursor = auto;    

Lamentablemente, no pasa nada. MyLongRunningMethod () lo hace correctamente, pero el cursor nunca cambia. Mi idea es que el navegador necesita esperar a que el método regrese para poder manejar el mensaje de cambio de cursor generado por el entorno de ventanas, pero puede estar muy lejos e incluso si es cierto, no sé cómo solucionarlo.

¿Alguna otra idea?


[edit]: Decidí que toda la historia de fondo que tenía no era realmente necesaria. Si realmente quieres leerlo, revisa el historial de revisiones.


Resultados finales

Terminé usando la solución de RoBorg. No estropea el código tanto como pensaba originalmente, porque puedo mantener la función declarada allí, es como agregar un bloque de alcance en línea.

Curiosamente, en Firefox descubrí que esto significa que no necesito cambiar el cursor. Descubrí que después de agregar la llamada a setTimeout, a veces veía aparecer un cursor de espera antes de que se estableciera el cursor de progreso, por lo que comenté el código de mi cursor. Resulta que algo en el uso de setTimeout para sacarlo del manejador de eventos click permite que Firefox sepa por sí mismo que el cursor debería cambiar. Desafortunadamente, IE no es tan inteligente, así que devolví el código del cursor.

Esto da credibilidad a mi creencia de que un cambio de cursor es la acción adecuada aquí, dada la oportunidad, es lo que el navegador hará de todos modos. Realmente no quiero tener que agregar y eliminar elementos nuevos (como una imagen ocupada de algún tipo) en el DOM para una página que conozco muy poco. El script debe coincidir sin importar el diseño visual que use la página.

Finalmente, Chrome hace que todo sea irrelevante. Usando los mismos datos, Chrome hace en menos de 5 segundos lo que le tomó a IE y Firefox de 10 a 15 segundos para lograrlo. Entonces su motor de javascript realmente es más rápido. No puedo esperar al motor Firefox 3.1. Desafortunadamente, la gente aquí todavía usa IE6 en su mayoría.

Publicado el 12/03/2009 a las 21:19
fuente por usuario Joel Coehoorn
En otros idiomas...        العربية       

3 respuestas

votos
9

¿Está utilizando un temporizador fuera de la cuestión?

document.body.style.cursor = "progress";

setTimeout(function()
{
    SortTable(cell.cellIndex, dir, sortType);
    document.body.style.cursor = "auto";
}, 10);
Respondida el 12/03/2009 a las 09:23
fuente por usuario Greg


Aquí podría ser tu PUBLICIDAD


votos
2

En la web, cambiar el cursor del mouse no es convencional y no es agradable.

Es mucho mejor (y más fácil) usar algunas pequeñas animaciones en la página, consultar http://www.ajaxload.info/ para ver esas imágenes (es un generador en línea).

Respondida el 12/03/2009 a las 09:49
fuente por usuario Ilya Birman

votos
0

Intente eliminar document.body.style.cursor = "auto" y colóquelo en una función llamada al finalizar su función SortTable. De esta forma, mantendrá el cursor ocupado hasta que la función se haya completado. Asegúrese de que si llega a una condición de error dentro de SortTable () todavía golpea la llamada a la función "No más ocupado".

Respondida el 12/03/2009 a las 09:43
fuente por usuario user64640