`

给imgMon图标添加tooltip信息

 
阅读更多

<br/>:主要应用于客服端
\n:主要应用于服务端

 

//给imgMon图标添加tooltip信息
<a><img id="imgMon" src="images/show_comment.gif" border="0" align="right"></a>

<form>
    <textarea rows="6" cols="40" style="display:none" id="monNote">
		${viewBean.bookingRecordCommonData.bkMonNote}
	</textarea>
</form>
	
$(document).ready(function(){
	
	var dataMon =${monNote}document.getElementById("monNote").value;
	dataMon=decodeURIComponent(dataMon);
//decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。
	
	$("#imgMon").tooltip({ 
    	track: true, 
    	delay: 0, 
    	showURL: false, 
    	bodyHandler: function() {
					dataMon=dataMon.replace(/\n/g, "<br/>");
// g 执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。
        	return $("<div></div>").attr("innerHTML",dataMon);
    	} 
	});

});

 

分享到:
评论

相关推荐

    echarts的axisLabel添加tooltip功能

    在ECharts这个强大的数据可视化库中,用户常常需要对图表的各个元素添加额外的信息以便于交互和理解。本文将深入探讨如何在ECharts的`axisLabel`上实现`tooltip`功能,以提供更加丰富的信息展示。 `axisLabel`是...

    给对话框控件添加 Tooltip

    而Tooltip是一种辅助控件,通常在鼠标悬停在其他控件上时显示简短的提示信息,帮助用户理解控件的功能。在这个场景中,我们讨论的是如何在对话框控件中添加自定义的Tooltip,即`CToolTipCtrl`。 `CToolTipCtrl`是...

    一个Vue2x的tooltip提示信息组件

    这些提示信息可以包含文字、图标或其他形式的内容,帮助用户理解页面元素的功能或状态。Vue的tooltip组件设计灵活,允许开发者通过属性和方法来自定义其行为和样式。 以下是一些关键知识点: 1. **组件安装**:...

    Echarts图标tooltip添加按钮点击.zip

    tooltip中添加一个查看按钮,并且点击获得触发点的数据进行操作 ehcarts显示正常,并且在toopltip中添加formatter(params)函数对toopltip进行html设置显示按钮,点击跳转其他页面

    Extjs4添加tooltip

    Extjs4的textfield控件竟然没有tooltip悬浮提示,这应该算是个bug吧。网上查了很多,也没有方案。后来自己通过查询并整理出这个方案,终于实现了。 思想如下: 在textfield渲染时注册mouseover事件,然后在其中调用...

    WXA-ToolTip-微信小程序-ToolTip信息提示组件.zip

    微信小程序-ToolTip信息提示组件导入将ToolTip文件夹复制到pages文件夹内使用在需要使用ToolTip的页面对应的.wxml文件中添加: src="../ToolTip/toolTip.wxml"/&gt; &lt;!-- 引入toolTip模板 --&gt;  is=...

    46.(cesium篇)cesium实现信息提示tooltip.zip

    在本教程中,我们将深入探讨如何使用Cesium库来实现信息提示(Tooltip)功能。Cesium是一个强大的开源JavaScript库,专用于在Web浏览器中创建3D地球和空间可视化应用。它提供了丰富的API和功能,使得开发者能够轻松...

    echarts自作地图显示散点图 tooltip自定义内容

    在我们的场景中,Tooltip可能需要显示每个散点的详细信息,比如地理位置、数据指标等。 5. **代码实践**: 实现上述功能需要编写JavaScript代码,主要包括初始化ECharts实例、配置option对象、加载地图JSON数据等...

    嵌入.NET控件到托盘图标Tooltip

    ### 嵌入.NET控件到托盘图标Tooltip #### 概述 本文旨在探讨如何在.NET框架下,为系统托盘(也称作任务栏通知区)中的`NotifyIcon`控件添加自定义控件至其弹出的气球提示(Balloon Tip)中。这通常用于提供更丰富的...

    WPF修改Tooltip样式

    在Windows Presentation Foundation (WPF) 中,Tooltip是一个用于显示与鼠标指针相关的简短提示信息的控件。它通常在用户将鼠标悬停在其他UI元素上时出现,提供额外的信息。在默认情况下,Tooltip的样式是有限的,但...

    纯CSS3实现的带小图标和tooltip提示框的垂直下拉菜单效果源码.zip

    这个压缩包文件“纯CSS3实现的带小图标和tooltip提示框的垂直下拉菜单效果源码.zip”提供了实现具有小图标和tooltip提示框的垂直下拉菜单的代码示例,这在网站设计和开发中是非常实用的功能。下面,我们将深入探讨这...

    博客-win32 工具提示ToolTip控件的使用

    我们可以直接在控件的属性中设置`TipText`,并且`CToolTipCtrl`类已经封装了添加、删除和更新`ToolTip`的操作,简化了编程过程。 总之,Win32 API中的`ToolTip`控件提供了一种直观的方式来增强用户界面的可理解性。...

    CSS3垂直图标菜单 带Tooltip提示框.zip

    2. **数据属性(Data Attributes)**:可以自定义元素属性,用于存储额外信息,如标识Tooltip内容。 3. **SVG(Scalable Vector Graphics)**:用于创建矢量图形,图标可以使用内联SVG或者作为背景图片,以确保在不同...

    表格单元格自定义ToolTip组件

    "表格单元格自定义ToolTip组件"是一个专门解决UI交互问题的工具,它允许开发者根据需求为表格中的每个单元格提供更加详细和丰富的信息提示。这种自定义的ToolTip在Flex组件上特别有用,Flex是一种强大的富互联网应用...

    9种经典的tooltip信息提示框

    在网页设计和开发中,tooltip是一种非常实用的交互元素,它能为用户提供额外的信息,而不会干扰主要界面的简洁性。"9种经典的tooltip信息提示框"可能包含了一系列不同的设计样式和实现方式,用于增强用户体验。下面...

    3D地球+自定义tooltip,自定义样式完美显示

    在描述中提到的“解决TOOLTIP不显示问题”,这通常是指在使用ECharts 3D地球时,由于默认的tooltip配置可能无法满足特定需求,导致数据提示信息无法正常显示。Tooltip是ECharts中一种重要的交互元素,当鼠标悬停在...

    如何为对话框上的一个按钮加提示条(ToolTip)

    在Windows应用程序开发中,添加提示条(ToolTip)到对话框上的按钮是一种常见的增强用户体验的方式。提示条能够在用户将鼠标悬停在某个控件上时显示相关信息,帮助用户理解控件的功能。本篇将深入讲解如何在VC6环境...

    很酷的tooltip信息显示控件源码

    4. **源码分析**:通过查看源码,我们可以学习到如何用特定编程语言实现自定义tooltip,包括事件监听、动态内容渲染、动画效果的添加等。 5. **响应式设计**:酷炫的tooltip可能还考虑了不同屏幕尺寸和设备的适配,...

    Tooltip

    【Tooltip】是一个在软件开发中常见的用户界面元素,它的全称是“工具提示”,用于向用户提供额外的信息。当用户将鼠标悬停在某个控件上时,Tooltip会显示一个小窗口,展示该控件的功能或者相关说明,帮助用户理解不...

Global site tag (gtag.js) - Google Analytics