बूटस्ट्रैप पॉपओवर इनपुट फ़ील्ड

Question

क्या उपयोगकर्ता किसी इनपुट फ़ील्ड में क्लिक करते समय पॉपओवर ईवेंट ट्रिगर करना संभव है, फिर उपयोगकर्ता इसे किसी अन्य फ़ील्ड में क्लिक करते समय अक्षम कर देता है? यहां मेरे पास है, लेकिन जब उपयोगकर्ता किसी अन्य फ़ील्ड में क्लिक करता है तो यह अक्षम नहीं होता है।

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

जब उपयोगकर्ता किसी अन्य इनपुट फ़ील्ड में क्लिक करता है तो मैं इस पॉपओवर को अक्षम कैसे कर सकता हूं? धन्यवाद!

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> 

आप बस निम्नलिखित js जोड़कर पॉपओवर छिपा कर सकते हैं है:

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

Answer 3

आप "ट्रिगर" का उपयोग करके "पॉपओवर" छुपा सकते हैं!

<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

मैं अपनी आसान अगर आप एचटीएमएल 5 का उपयोग लगता है:

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