Bootstrap Popover Поле ввода

Question

Возможно ли инициировать событие popover, когда пользователь нажимает на поле ввода, а затем отключает его, когда пользователь нажимает на другое поле? Вот что у меня есть, но он не отключается, когда пользователь щелкает в другом поле.

<input id="example" /> 

<script> 
    $(document).ready(function() { 
    $(function() 
     { $("#example").popover({title: 'Twitter Bootstrap Popover', content: "It's so simple to create a tooltop for my website!"}); 
    }); 
    }); 
</script> 

Как я могу отключить этот popover, когда пользователь нажимает на другое поле ввода? Спасибо!

Answer 1

Один простой способ скрыть это было бы подписаться на blur:

$(function() { 
    $("#example") 
     .popover({ title: 'Twitter Bootstrap Popover', content: "It's so simple to create a tooltop for my website!" }) 
     .blur(function() { 
      $(this).popover('hide'); 
     }); 
}); 

Answer 2

Давайте предположим, что ваша ссылка

<a href="#foo" id="bas">bar<a> 

вы можете скрыть поповер, просто добавив следующие ЯШ:

$('#bas').on('click',function() { 
    $('#example').popover('hide'); 
}); 

Answer 3

Вы можете скрыть «popover» с помощью «триггера»!

<script> 
$(document).ready(function() { 
    $(function() 
    { 
     $("#contato").popover({title: 'Twitter Bootstrap Popover', trigger: 'focus', content: "It's so simple to create a tooltop for my website!"}); 
    }); 
}); 
</script> 

Answer 4

Я сделал некоторые испытания с Christoffers ответ и получил его к минимуму:

$('#element').popover({ trigger: 'focus', title: 'Twitter Bootstrap Popover', content: "It's so simple to create a tooltop for my website!" }) 

Answer 5

Я думаю, его легче, если вы используете HTML5:

$(document).ready(function() { 
    $('#example').popover(); 
} 

<input id="example" type="text" data-toggle="popover" data-trigger="focus" data-placement="right" data-content="It's so simple to create a tooltop for my website!" />