【问题标题】:Appending or adding new text next to current tooltip text JQuery在当前工具提示文本 JQuery 旁边附加或添加新文本
【发布时间】:2016-06-22 15:06:57
【问题描述】:

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

例如,我有一个包含工具提示文本的 div 标签,如下所示;

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

如上图,当前tooltip文本为:This is Tooltip

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

This is toopltip for myDiv1

我试过了,但这些似乎不起作用,而且大多数都没有返回任何东西,有些返回 undefined,请帮忙;

$('#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");

欢迎任何帮助:)

【问题讨论】:

    标签: javascript jquery html append jquery-tooltip


    【解决方案1】:

    尝试使用.attr()callBack函数来完成你的任务,

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

    【讨论】:

    • 这似乎可以解决问题,但是,我将等待更长的时间,看看还有什么其他方法可用 :) 意思是 +1,谢谢。
    • @Henry 很高兴为您提供帮助! :)
    【解决方案2】:

    我会这样做:

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

    See jsfiddle.

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

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

    【讨论】:

    • 简短 +1 :)
    【解决方案3】:
    var currentVal = $('#myDiv1').attr('title');
    $('#myDiv1').attr('title', currentVal + ' potatoe');
    

    小提琴:https://jsfiddle.net/jdz5yz6k/

    【讨论】:

      【解决方案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");
       });
       })
      

      【讨论】:

        猜你喜欢
        • 2012-06-15
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2018-05-19
        • 1970-01-01
        • 1970-01-01
        • 2021-02-05
        • 2015-09-18
        相关资源
        最近更新 更多