在当前工具提示文本旁边追加或添加新文本 JQuery

Question

我想知道是否可以在工具提示上已有的文本旁边添加新文本或将文本附加到现有文本。

例如，我有一个 div 标签，其中包含这样的工具提示文本；

<div id="myDiv1" class="myDiv" title="This is Tooltip">body text </div>

如上图，当前tooltip文字为：This is Tooltip

我想做的是使用 jquery，为此添加/添加更多文本。例如，

This is toopltip for myDiv1

我试过了，但这些似乎都不起作用，而且大多数都不起作用 return 有一些 return 未定义，请帮忙；

$('#myDiv1').attr("title",  $('#myDiv1').tooltip + "" + "\nSome new text to append");
$('#myDiv1').prop("tooltipText",  $('#myDiv1').tooltipText + "" + "\nSome new text to append");
$('#myDiv1').attr("data-original-title",  $('#myDiv1').tooltipText + "" + "\nSome new text to append");

欢迎任何帮助:)

Answer 1

尝试使用.attr()的callBack功能来完成你的任务，

$('#myDiv1').attr("title", function(_ , currentAttr){
  return currentAttr + "your text";
});

Answer 2

var currentVal = $('#myDiv1').attr('title');
$('#myDiv1').attr('title', currentVal + ' potatoe');

fiddle:https://jsfiddle.net/jdz5yz6k/

Answer 3

我会这样做：

$('#test').attr('title', $('#test').attr('title') + '\nworld');

See jsfiddle.

我要补充一点，如果您使用函数，它会为您提供当前元素作为上下文，这非常有用：

$('#test').attr('title', function() {
  console.log($(this).attr('title'));
});

Answer 4

就这么简单，首先我们需要得到这个div的当前标题。之后我们必须附加一些带有这个标题的文本。

这是 Jsfiddle 示例

<div id="myDiv1" class="myDiv" title="This is Tooltip">body text </div>

Then the Jquery Code is:

$(document).ready(function(){
$(".myDiv").hover(function(e){
    $(this).attr('title',$(this).attr('title')+"This is new text that will be added");
 });
 })

在当前工具提示文本旁边追加或添加新文本 JQuery

Appending or adding new text next to current tooltip text JQuery

html

javascript

jquery

append

jquery-tooltip