EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: Coder on October 03, 2019, 06:23:26 AM



Title: tooltip content with <a> elm
Post by: Coder on October 03, 2019, 06:23:26 AM
Code:
function fmtEditore(val,row){
 return '<span class="easyui-tooltip" '
+'title="'+row.editor+'<br><span class=\'small\'>'
+'<a href=\'https://stat.ripe.net/widget/maxmind-geo-lite#w.resource='+row.editVIA.split('|')[0]+'\' target=\'ripe\'>[GeoIP]</a>'
+'<a href=\'https://stat.ripe.net/widget/whois#w.resource='+row.editVIA.split('|')[0]+'\' target=\'ripe\'>[WhoIS]</a>'
+'<a href=\'https://www.infobyip.com/?ip='+row.editVIA.split('|')[0]+'\' target=\'ripe\'>[InfoByIP]</a>'
+row.editVIA.split('|').join('<br>')+'</span>"'
+' data-options="hideEvent:\'none\''
      +',onShow: function(){'
      +'var t = $(this);'                                    // blur
+'t.tooltip(\'tip\').focus().unbind().bind(\'mouseleave blur\',function(){t.tooltip(\'hide\')});'
      +'}'
    +'"'
+'>'+val+'</span>'
}

without 'blur' all work fine but tooltip didnt hide when select another row in datagrid.

with 'blur' tooltip work fine but user can`t do click on href : tooltip close before send call event to <a>

how to : <a> do click and tooltip hide when tooltip blur ?


Title: Re: tooltip content with <a> elm
Post by: jarry on October 04, 2019, 05:37:50 AM
Please try this code.
Code:
onShow: function(){
var t = $(this);
t.tooltip('tip').unbind().bind('mouseenter', function(){
t.tooltip('show');
}).bind('mouseleave', function(){
t.tooltip('hide');
});

}