jquery на размытие, но сосредоточьтесь на другом

У меня есть ситуация, когда у меня есть скрытый div с двумя элементами ввода, где он скрывается по умолчанию и появляется, только если я что-то навожу, и исчезает, если я навожу курсор. Теперь я хочу, чтобы этот div не исчезал, если один из элементов ввода был сфокусирован и исчезал, если он был размыт. Я решил эту часть до тех пор, пока, если фокус не переместится с одного входа на другой, div исчезнет, ​​и я не хочу, чтобы он исчез, потому что один из входов все еще сфокусирован.

Вот мой код:

// code with the problem I think.
$('#inputText1, #inputText2').live("blur", function() {
    if ($('#myDiv').is(":visible")) {
        if (!$(this).hasClass("jqTransformInputWrapper_focus")) {
            $('#myDiv').fadeOut("slow");
        }
    }
});

// hover to show and hide the div
$(".visibleDiv").hover(
    function() {
        $('#myDiv').fadeIn("slow");
    },
    function() {
        if(!$(this).find(".jqTransformInputWrapper").hasClass("jqTransformInputWrapper_focus")) {
            $('#myDiv').fadeOut("slow");
        }
    }
);

Мой HTML:

<div class="visibleDiv">
    hover me
    <div id="myDiv">
        <input name="inputText1" id="inputText1" type="text" />
        <input name="inputText2" id="inputText2" type="text" />
    </div>
</div>

Кстати, я использую jqTransform для элементов ввода.


focus blur jquery
person rob waminal    schedule 18.02.2011    source источник

Ответы (2)


arrow_upward
1
arrow_downward

попробуй это,

// code with the problem I think.
$('#inputText1, #inputText2').live("blur", function() {

    if ($('#myDiv').is(":visible")) {
        if (!$(this).hasClass("jqTransformInputWrapper_focus")) {
            $('#myDiv').fadeOut("slow");
        }
    }

}).live("focus",function(){
    $('#myDiv').stop(true,true).show();
});
person Reigel    schedule 18.02.2011
comment
это прекрасно работает без live, но только в FF, есть ли обходной путь для этого в IE? - person rob waminal; 18.02.2011

arrow_upward
0
arrow_downward

дайте некоторый класс для поля ввода и примените jQuery к этому

<div class="visibleDiv">
    hover me
    <div id="myDiv">
        <input name="inputText1" id="inputText1" type="text" class="inputbox" />
        <input name="inputText2" id="inputText2" type="text" class="inputbox"/>
    </div>
</div>


// now this will work
$('.inputbox').live("blur", function() {
 // u can also use this
 // if($(this).parent().is(":visible") )
    if ($('#myDiv').is(":visible")) {
        if (!$(this).hasClass("jqTransformInputWrapper_focus")) {
            $('#myDiv').fadeOut("slow");
        }
    }
});

Примечание. используйте делегата вместо живого

person diEcho    schedule 18.02.2011
comment
на самом деле это то же самое, что я делаю. Мой относится только к двум. - person rob waminal; 18.02.2011