Simple way to check if input is in focus and to disable mouseleave function if true
I have to admit that I'm definitely no jQuery genius but what seems like asimple solution has just totally eluded me.
Basically I have a drop down script working on a nested ul to display on rollover of its parent. In one of the nested ul I have a form that I would like to stop the mouseleave event if any of the inputs in the form are being entered into.
Here's the original code:
$(document).ready(function() {
/*------- navigation -------*/
$('.top_menu li').hover(function(){
var index = $('.top_menu li').index(this);
if($(this).children('ul').length != 0)
{
$(this).children('ul').show();
}
});
$('.top_menu li').mouseleave(function(){
$(this).children('ul').hide();
});
$('.login_cart li,.login_cart_captu li').hover(function(){
var index = $('.login_cart li').index(this);
if($(this).children('ul').length != 0)
{
$(this).children('ul').show();
}
});
$('.login_cart li,.login_cart_captu li').mouseleave(function(){
$(this).children('ul').hide();
});
});
I'm really only concerned with the .login_cart li portion of the script - that's the only one that has the form within it.
I've tried with a simple if/else statement to not hide if an input has focus but that hasn't worked so far.
Any help anyone could give me o开发者_开发知识库r to shed some light on this would be absolutely wonderful.
Thanks in advance!
you can bind the focus event of the form elements to a function that unbinds the mouseleave event from the .login_cart li:
$("#<form-id> input").focus(function() {
$(".login_cart li, .login_cart_captu li").unbind("mouseleave");
}
You'll just have to replace with the id of your form or you can use whatever selector you want to select your form.
jQuery 1.6 and newer has :focus built in. Not tested with .not(), but have tested this with a ! in front and .is(":focus"), just looked nicer with .not(); but both should do the same.
$('.login_cart li,.login_cart_captu li').mouseleave(function(){
if ($("#<form-id> input").not(":focus")) {
$(this).children('ul').hide();
}
});
精彩评论