javascript - hacer - simulate hover jquery

Simular Hover en jQuery

Question

Actualmente, tengo un poco de código jQuery / Javascript que alterna la clase css ''ui-state-hovered'' cuando un usuario pasa el mouse sobre ciertos elementos, y quiero escribir una prueba en konacha para probar este fragmento de código.

¿Cómo escribiría esta función en Javascript con la ayuda de jQuery?

Devuelve verdadero si cuando un usuario se desplaza sobre un elemento $ ('''' someClass li: first ''), existe la clase'' ui-state-hovered ''. Si no devuelve falso.

¿Cómo simularía un usuario al pasar el mouse sobre ese elemento?

Answer 1

Función de escritura en el hover

$(''.someClass li:first'').hover(function(){
      return $(this).attr(''class'').indexOf(''ui-state-hovered'') > -1;
});

Answer 2

Shorthand set mouseenter / mouseleave eventos

$(".someClass li:first").hover(
  // Mouse Over
  function(){
    $(this).addClass("ui-state-hovered");
  },
  // Mouse Out
  function(){
    $(this).removeClass("ui-state-hovered");
});

EDITAR

Establecer evento mouseenter

$(".someClass li:first").mouseenter(function(){
    $(this).addClass("ui-state-hovered");
  }

Establecer evento

$(".someClass li:first").mouseleave(function(){
    $(this).removeClass("ui-state-hovered");
});

Para simular el mouseover:

$(".someClass li:first").trigger("mouseenter");

Para simular el mouseout:

$(".someClass li:first").trigger("mouseleave");

Para verificar una clase:

$(".someClass li:first").hasClass("ui-state-hovered");

Para devolver verdadero si tiene una clase:

function checkClass(elem, class){
  return $(elem).hasClass(class);
};

Editar 2

Nunca he usado Konacha antes, pero si tuviera que intentarlo utilizando esta guía en solitr.com como mi guía , diría:

HTML

<div id="testDiv" class="foo">Some Text</div>

jQuery

checkClass = function(elem, class){
    return $(elem).hasClass(class);
};

Konacha

describe(''checkClass'', function() {
    it(''should be true if elem has class'', function() {
        checkClass("#testDiv", "foo").should.be.true;
        checkClass("#testDiv", "bar").should.be.false;
    });
});

Answer 3

Ver here

$(''someClass li:first'').mouseover();

Esto debería desencadenar el evento.

Answer 4

utilizando la consola puede probar $ (''# yourelement''). trigger (''mouseover'');

Answer 5

Intente mouseenter y mouseleave

$(''.someClass li:first'').mouseenter().mouseleave();

Desde jQuery docs

Llamar a $(selector).hover(handlerIn, handlerOut) es una abreviatura de: $(selector).mouseenter(handlerIn).mouseleave(handlerOut);

DEMO: http://jsfiddle.net/skram/wh5N9/

Intente a continuación para buscar una clase que se haya agregado en el hover

$("#test").mouseenter(function() {
    console.log(''Has class hover '' + $(this).hasClass(''ui-state-hovered''));
}).mouseleave(function() {
    console.log(''Has class hover '' + $(this).hasClass(''ui-state-hovered''));
})

Asegúrese de que se haya registrado lo anterior después de .hover

DEMO: http://jsfiddle.net/skram/wh5N9/2/