用于bootstrap选择的动态工具提示

栏目: 技巧 · 发布时间: 2021-04-13

简介  这篇文章主要介绍了用于bootstrap选择的动态工具提示以及相关的经验技巧,文章约1415字,浏览量384,点赞数1,值得参考!

当我将鼠标移到项目工具提示时,我需要添加动态工具提示以引导选择下拉列表文本应显示其值。但在我的例子中只显示静态文本或显示所有项目的值!(在图片中)[https://cdn1.imggmi.com/uploads/2018/9/7/21093ba294817db8cb4cf968e467fe64-full.png]如何将每个项目值放入项目工具提示?

谢谢

// in this I try to add each span text to each li element???
    var tooltipMap = {};
    $('#id').data('selectpicker').$lis.each(function () {
    var li = $(this);
    var elementtext = li.find('span.text').text();
    var tooltipString = tooltipMap[elementtext];
    if (tooltipString){
        li.tooltip({ trigger: 'hover', placement: 'right', title: tooltipString }); }

//show only static text inside tooltip for all loaded items
    $('#id').data('selectpicker').$lis.attr('title', 'static text').tooltip();}); 
答案

工作版

 $("#id").each(function (i) {

                if ( i > 0 ) {
                    var test= "title is : " + $(this).text();

                    $(this).attr("title", sube).tooltip();
                   //alert(test);
                }

        });

为静态文本工作

$('#id').on('shown.bs.select', function () {
$($(this).data('selectpicker').current.elements).attr('title', sube).tooltip();
 });

以上就是本文的全部内容,希望对大家的学习有所帮助,版权归原作者或者来源机构所有,感谢作者,如果未能解决你的问题,请参考以下文章。

部分显示ag-grid单元内的Bootstrap工具提示

如何设置bootstrap 4的工具提示[重复]

如何使用php在工具提示Bootstrap 4中显示图像(示例代码)

Bootstrap 标签页和工具提示插件(示例代码)

bootstrap 工具提示框 弹出框 要事先初始化(示例代码)