我在一个锚元素上有一个工具提示,它在单击时发送AJAX请求。该元素有一个工具提示(来自Twitter Bootstrap)。我希望在AJAX请求成功返回时改变工具提示内容。启动后如何操作工具提示?


当前回答

我只在bootstrap 4和w/o调用.show()中测试了这个

el.tooltip('hide').attr('data-original-title', 'message');

其他回答

下面是Bootstrap 4的更新:

var title = "Foo";
elt.attr('data-original-title', title);
elt.tooltip('update');
elt.tooltip('show');

但最好的办法是这样做:

var title = "Foo";
elt.attr('title', title);
elt.attr('data-original-title', title);
elt.tooltip('update');
elt.tooltip('show');

或内联:

var title = "Foo";
elt.attr('title', title).attr('data-original-title', title).tooltip('update').tooltip('show');

从用户体验方面,你只看到文本被改变,没有褪色或隐藏/显示效果,也不需要_fixTitle。

当ajax请求成功返回时,可以使用此代码隐藏工具提示,更改其标题并再次显示工具提示。

$(element).tooltip('hide');
$(element).attr('title','this is new title');
$(element).tooltip('fixTitle');
setTimeout(function() {  $(element).tooltip('show');}, 500);

Bootstrap 5不再有fixTitle或_fixTitle,所以我不得不处理整个Tooltip对象并重建它:

$('a.copy').click(function() {
    var tt = bootstrap.Tooltip.getInstance(this);
    tt.dispose();
    this.setAttribute('title', 'Copied!')
    tt = bootstrap.Tooltip.getOrCreateInstance(this);
    tt.show();
}

我用这个简单的方法:

$(文档)时函数(){ $ (" # btn”)。prop('title', '点击复制你的短片'); }); 函数myFunction () { 美元(btn) .tooltip(隐藏的); (btn)美元。attr(“data-original-title”、“测试”); 美元(btn) .tooltip(显示); });

我不能得到任何答案工作,这里有一个变通办法:

$('#'+$(element).attr('aria-describedby')+' .tooltip-inner').html(newTitle);