JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<input type="text" id="comfoco" value="Clique aqui"> <br>
<input type="text" id="comselect" value="Selecione este texto"> <br>
<br><br>
<i class="glyphicon glyphicon-map-marker glyp-search tooltip-icon"></i>
JavaScript
jQuery(document).ready(function($) {
function startTooltip(texto){
return $('.tooltip-icon').tooltip({
placement: 'top',
title: texto
});
};
$(document).on('focus', '#comfoco', function(){
startTooltip('Entrou no campo...').tooltip('show');
})
$(document).on('select', '#comselect', function(event){
startTooltip('Você selecionou algo...').tooltip('show');
});
$(document).on('blur', '#comfoco, #comselect', function(){
$('.tooltip-icon').tooltip('hide');
})
});