zoukankan      html  css  js  c++  java
  • Bootstrap Tooltip 显示换行

        <a class="pink"  href="#"  data-toggle="tooltip" data-placement="left" data-html="true"  title="AA:123&#10;BB:456">
                     <div class="table-cell"><i class="icon-hand-right"></i>
                    
    点击我                </a>
     <script type="text/javascript">
                      //tooltips
                      $('[data-toggle="tooltip"]').tooltip();
    //                  $(".pink").tooltip({
    //                      show: null,
    //                      position: {
    //                          my: "left top",
    //                          at: "left bottom"
    //                      },
    //                      open: function (event, ui) {
    //                          ui.tooltip.animate({ top: ui.tooltip.position().top+10}, "fast");
    //                      }
    //                  });
                </script>

    换行问题

    遇到换行,我们首先想到的是将” ”替换成”<br/>”,我也是这么做的,可惜这在Tooltip中不管用。Tooltip直接把”<br/>”当作文字显示出来了。

    jquery-ui-1.10.3.full.min.js  修改该类如下代码:

    var i="ui-tooltip-"+s++,n=t("<div>")  改为 var i="ui-tooltip-"+s++,n=t("<pre>")
    

    最后,均可实现html标签内title内容显示时换行。

    换行代码符合分别为:
    &#10;”和“&#13;

  • 相关阅读:
    指数
    汉诺塔问题
    只用递归和当前的栈实现栈的逆序
    让你996的不是你的老板,而是其他愿意996的人
    luke towan
    2020-9-3
    2020-9-3
    springboot注解
    2020-9-2
    20200827
  • 原文地址:https://www.cnblogs.com/Fooo/p/7806857.html
Copyright © 2011-2022 走看看