<a class="pink"  href="#"  data-toggle="tooltip" data-placement="left" data-html="true"  title="AA:123
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>

换行问题

遇到换行,我们首先想到的是将”\n”替换成”<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内容显示时换行。

换行代码符合分别为:
”和“

Bootstrap Tooltip 显示换行的更多相关文章

  1. bootstrap tooltip 显示提示信息

    参照网上文档,是这样说的, <a data-toggle="tooltip" data-placement="top" title="这是要提示 ...

  2. 扩展Bootstrap Tooltip插件使其可交互

    最近在公司某项目开发中遇见一特殊需求,请笔者帮助,因此有了本文的插件.在前端开发中tooltip是一个极其常用的插件,它能更好向使用者展示更多的文档等帮助信息.它们通常都是一些静态文本信息.但同事他们 ...

  3. bootstrap插件学习-bootstrap.tooltip.js

    先看bootstrap-tooltip.js的结构 var Tooltip = function ( element, options ){} // 构造器 Tooltip.prototype ={} ...

  4. Bootstrap Tooltip

    [Bootstrap Tooltip] 1.设置Tooltip: 1)data-toggle="tooltip" 2)data-placement="top", ...

  5. 使用tooltip显示jquery.validate.unobtrusive验证信息

    通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息,效果如图: 1. 在ViewModel中定义验证规则 [Display(Name = " ...

  6. Bootstrap Tooltip源码分析

    /* ======================================================================== * Bootstrap: tooltip.js ...

  7. [WPF]TextTrimming截断后,ToolTip显示完整信息

    文本过长被截断后,用ToolTip显示完整信息. 文本未被截断,则不显示ToolTip. 值转换器: public class TrimmedTextBlockVisibilityConverter ...

  8. echarts之字符云tooltip显示混乱问题的解决办法

    echarts字符云中tooltip显示混乱主要表现为一下两点: 1.字体与其显示框内容不对应鼠标识别错误 解决思路: 就是option里的数据要对value降序排序(这一点很关键,是必须的一步) 把 ...

  9. (网页)JS实现alert中显示换行的方法

    转自脚本之家: 这篇文章主要介绍了JS实现alert中显示换行的方法,实例分析了两种实现alert换行的实现技巧,非常简单实用,需要的朋友可以参考下 本文实例讲述了JS实现alert中显示换行的方法. ...

随机推荐

  1. Orchard是如何呈现内容的

    首先Orchard是一个建立在ASP.NET MVC框架上的CMS应用框架.Orchard在呈现内容的时候也遵循MVC的规律,也是通过Controller来处理Url请求并决定用那个View来呈现那种 ...

  2. Practical Node.js (2018版) 第8章:Building Node.js REST API Servers

    Building Node.js REST API Servers with Express.js and Hapi Modern-day web developers use an architec ...

  3. laravel进行单元测试的时候如何模拟数据库以及mockery的调用

    单元测试是独立的,所谓的独立是指有独立的运行容器,独立的数据库. 这样做有什么好处呢? (1). 不会跟正常的容器产生冲突,继而影响正常业务. (2). 数据库独立防止数据被修改影响单元测试结果. 这 ...

  4. p6spy简介

    在公司项目中运用了这项技术,一开始不清楚这是干啥用的,在网上查找资料有所一定的了解,但是应该不够全面,希望可以评论指出. p6spy是数据库动态监控的一种框架,它可以使得数据库数据无缝拦截和操作,而不 ...

  5. @ControllerAdvice + @ExceptionHandler 全局处理 Controller 层异常

    @ControllerAdvice 和 @ExceptionHandler 的区别 ExceptionHandler, 方法注解, 作用于 Controller 级别. ExceptionHandle ...

  6. hello1

    1:选择hello1文件夹并单击“打开项目”.展开“Web页”节点,然后双击该index.xhtml文件以在编辑器中查看它. 该index.xhtml文件是Facelets应用程序的默认登录页面.在典 ...

  7. 微信支付---公众号支付和H5支付区别

    微信支付分为如下几种:(来源https://pay.weixin.qq.com/wiki/doc/api/index.html) 本文主要讲解公众号支付和H5支付,两者均属于线上支付比较常用的方式: ...

  8. vue-常用指令

    一.一些指令 1.v-bind 绑定元素(简写 :) <div id="app-2"> <span v-bind:title="message" ...

  9. 颜色(color)透明

    颜色写法: 1.英文单词 backgroud-color:red: 2. #fff background-color:#fff; 3.#fefefe background-color:fefefe; ...

  10. 并发,同步锁,Runnable,Callable,Future

    1.并发: 在我们的操作系统中,同一个时间点,有N个线程都想访问同一个程序!但是cpu只能运行一个! 这种情况就是! 多个线程在 同一个时间点 访问同一个资源,会引发线程不安全的问题! 怎么解决这种不 ...