jquery动态工具提示
问题描述:
想要显示工具提示动态数据点击 已经尝试了很多插件,但没有达到我的目标。jquery动态工具提示
这里我的代码:
<script type="text/javascript">
$(document).ready(function() {
$("#tbl td").click(function() {
$.ajax({
type: "POST",
url: '@Url.Action("GetCellData")',
dataType: 'JSON',
data: {
time: $(this).parent().children().index($(this)),
name: $('td:first', $(this).parents('tr')).text(),
type: $('input[name="t"]:checked').val()
},
success: function (response) {
///
/// HERE I NEED TO SHOW TOOLTIP
///
}
});
});
});
我需要使用回调 '响应',以显示它的提示,在MUSE点击单元格。 可以请你推荐我插件,为我的问题。
答
像这样的事情
$(document).ready(function() {
$("#tbl td").click(function() {
var $td = $(this);
$.ajax({
type: "POST",
url: '@Url.Action("GetCellData")',
dataType: 'JSON',
data: {
time: $(this).parent().children().index($(this)),
name: $('td:first', $(this).parents('tr')).text(),
type: $('input[name="t"]:checked').val()
},
success: function (response) {
var pos = $td.position();
$('#tooltip').remove();
$('<div/>',{html:response, id:'tooltip'}).css({left:pos.left+10+'px', top:pos.top+10+'px'}).prependTo('body');
}
});
});
});
,并在你的CSS使那些创造这些规则
#tooltip{
position:absolute;
width:150px;
padding:15px;
border:1px solid #000;
background-color:#fff;
color:#000;
}
可以样式化无论如何,你喜欢的工具提示..当然..