jQuery: если $ (this) или другой элемент размывается, то - PullRequest
Новая
       27

jQuery: если $ (this) или другой элемент размывается, то

2 голосов
/ 29 ноября 2011

Я хочу вызвать функцию, если размыкает либо активный в данный момент элемент $ (this), либо другой предопределенный элемент (например, div # tooltip).Однако до сих пор я не узнал, как это сделать.Я пробовал: 

$(this).add('div#tooltip').live('blur', function(){
    $('div#tooltip').hide();
});

Представьте, что $ (this) будет, например, полем ввода, а предопределенный второй элемент будет div всплывающей подсказки, и что я бы хотел, чтобы подсказка скрывалась, еслииз этих пятен.

EDIT : всплывающая подсказка div # содержит привязку, которая не должна скрывать подсказку div #, если на нее нажимают.

EDIT2 : Хорошо, вот более точное объяснение моей проблемы.У меня есть функция $ .fn.tooltip, которую я применяю к различным текстовым вводам, которые имеют имена классов переменных и идентификаторы.Следовательно, этот вход может упоминаться только как $ (this) внутри функции.Во-вторых, у меня есть всплывающая подсказка div, которая создается функцией.Этот div идет по ID #tooltip.Эта подсказка / div может содержать некоторые другие элементы, такие как якоря.Всплывающая подсказка отображается автоматически при нажатии на поле ввода (это).После закрытия он больше не будет отображаться, даже если поле ввода снова будет сфокусировано.Я пытаюсь сделать следующее:

Подсказка должна быть удалена, когда ввод текста теряет фокус ИСКЛЮЧИТЬ , если курсор находится внутри подсказки / div или еслиэлемент внутри этого элемента нажимается.

Кто-нибудь?

Ответы [ 2 ]

1 голос
/ 29 ноября 2011

Например: http://jsfiddle.net/uu3zX/7/

HTML: 

<input type="text" class="with-tooltip">
<span class="tooltip">?<a style="display:none" href="#">The tip</a></span>

JavaScript: 

$('.with-tooltip').on('focus', function(){
    $(this).next().children().show();
});

$('.with-tooltip').on('blur', function(){
    $(this).next().children().hide();
});

$('.tooltip').hover(
    function(){
       $(this).children().show();
    },
    function(){
       $(this).children().hide();
    }
);

ОБНОВЛЕНИЕ Добавлено альтернативное решение для соответствия OPтребование использовать this

0 голосов
/ 29 ноября 2011

Заимствование из скрипки IntoTheVoid: Вы должны заключить ввод и всплывающую подсказку в элемент контейнера (или другой элемент контейнера), чтобы сделать это в одну строку: 

$('.tooltip, input').on('mouseout', function(){
    $(this).parent().children('.tooltip').hide();
}).on('focus mouseover', function(){
    $(this).parent().children('.tooltip').show();
});

http://jsfiddle.net/mblase75/uu3zX/5/

...