Qtip ajax动态选择数据

时间:2014-05-19 17:33:48

标签: jquery ajax tooltip

我尝试了Qtip

$the_tooltip= "TEST\nTEST2";

echo "<td id=25 title=".$the_tooltip." >

我有这个

$(document).ready(function () {
        $('[title!=""]').qtip();


    })

工作正常。我已经看到了关于ajax的qtip链接,但是我如何将一些ID传递给我的url来获取相关信息。

其次如何在下一行格式化我的工具提示。

1 个答案:

答案 0 :(得分:1)

您可以参考以下链接了解更多详情: http://qtip2.com/plugins

可以根据名称值对在Ajax请求的data属性中传递ID。例如: ID = 10 ajax调用看起来像

    $.ajax({
    url:"URL to the link",
    type:"POST or GET",
    data:"ID=10"
    }).done(function(data){
    //print the data for the success result.
    });

//The code to apply mouseenter and mouse leave on each td element.
    var tdElements = $("td");
    $.each(tdElements,function(i,v){
    $(this).on("mouseenter",function(e){
    var idval = $(this).attr("id");
        $(this).qtip({
    content: {
        text: 'Loading...', // The text to use whilst the AJAX request is loading
        ajax: {
            url: '/path/to/file', // URL to the local file
            type: 'GET', // POST or GET
            data: {ID:idval} // Data to pass along with your request
        }
    }
}).done(function(data){

});
            }).on("mouseleave",function(e){
        //Code to behave when the mouse leaves the td element.
        });
        });