it-swarm.com.de

Bootstrap-Popover-Eingabefeld

Kann ein Popover-Ereignis ausgelöst werden, wenn ein Benutzer in ein Eingabefeld klickt, und dann deaktiviert, wenn der Benutzer in ein anderes Feld klickt? Hier ist was ich habe, es wird jedoch nicht deaktiviert, wenn der Benutzer in ein anderes Feld klickt. 

 <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> 

Wie kann ich dieses Popover deaktivieren, wenn der Benutzer in ein anderes Eingabefeld klickt? Vielen Dank!

15
Nick B

Eine einfache Möglichkeit, es zu verbergen, wäre, blur zu abonnieren:

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

Ich habe einige Tests mit der Antwort von Christoffers gemacht und diese minimiert:

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

Ich denke, es ist einfacher, wenn Sie HTML5 verwenden:

$(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!" />
6
tony

Sie können den "Popover" mit "Trigger" ausblenden!

<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> 
2
Fabiano

Nehmen wir an, Ihr Link ist

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

sie können den Popover ausblenden, indem Sie einfach die folgenden Js hinzufügen:

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