2015-07-20 51 views
1

我有一个元素的网页,当鼠标悬停在元素上时,文本出现在元素内部。 我想要生成“鼠标悬停”/“鼠标”显示文本,即使没有鼠标实际悬停在元素上。 代码,例如:jQuery在没有实际鼠标输入元素的情况下触发mouseenter元素

HTML

<div> 
    <span id="hover_to_show_text">Hover here to show hidden text</span> 
    <span id="hidden_text" style="display:none">Hidden text</span> 
</div>  

JS

$("#hover_to_show_text").mouseenter(function() { 
    $(#hidden_text).show(); 
}); 
$("#hover_to_show_text").mouseleave(function() { 
    $(#hidden_text).hide(); 
}); 

我想产生 “的mouseenter” 这会触发“$( “#hover_to_show_text”).mouseenter (函数(){“在jQuery中,并在那里离开”mouseenter“达N秒。我试过(分开):

$("#hover_to_show_text").hover(); 
$("#hover_to_show_text").trigger('mouseover'); 
$("#hover_to_show_text").trigger('mouseenter'); 

没有工作。有没有办法做到这一点?

谢谢。

+0

不知道我完全理解你的问题。但在你的代码放在jsfiddle后,它似乎触发mouseover和mouseenter成功http://jsfiddle.net/p694huuk/ – EmileKumfa

+0

我不认为你正在做对了你的代码运行良好....你确定你有jQuery在你的项目 – code

+0

在上面的代码中有错别字。和'$(“#hover_to_show_text”)。trigger(“mouseenter”);'应该工作。 – epascarello

回答

3

应该工作。事件几乎立即触发。所以你可能没有看到差异。

setTimeout之内处理mouseleave的扭曲以查看区别。

$("#hover_to_show_text").mouseenter(function() { 
    $('#hidden_text').show(); 
}); 
$("#hover_to_show_text").mouseleave(function() { 
    $('#hidden_text').hide(); 
}); 

$("#hover_to_show_text").trigger('mouseover'); 

setTimeout(function() { 
    $("#hover_to_show_text").trigger('mouseleave'); 
}, 1500); 

Check Fiddle

更新

// Just triggering the click event will not work if no 
// click handler is provided. 
// So create one first 
$("#btn").on('click', function() { 

    // trigger the mouse enter event 
    $("#hover_to_show_text").trigger('mouseenter'); 

    setTimeout(function() { 
     $("#hover_to_show_text").trigger('mouseleave'); 
    }, 1500); 

}); 

Update Fiddle

+0

它会从第三个元素工作吗? – BenB

+0

@batz你是什么意思的第三个元素。 –

+0

我的意思是一个otherr按钮会触发它。像这样:http://jsfiddle.net/Loof31rq/1/ – BenB