Question

我正在使用qTip jQuery插件来创建动态工具提示。工具提示将一个id发送到cfc，cfc运行查询并以JSON格式返回数据。

目前，工具提示加载以下内容：

{"COLUMNS:" ["BOOKNAME","BOOKDESCRIPTION"["MYBOOK","MYDESC"]]}

这是jQuery

$('#catalog a[href]').each(function()
{
    var gi = parseInt($(this).attr("href").split("=")[1])
    $(this).qtip(
    {
        content: {
            url: 'cfcs/viewbooks.cfc?method=bookDetails',
            data: { bookID: gi  },
            method: 'get',
            title: {
                text: $(this).text(),
                button: 'Close'
            }
        },
        api :{
        onContentLoad : function(){
            }
        },
    });
});

正如我所提到的，数据已成功返回，但我不确定如何输出数据并使用HTML格式化。

我尝试将content: '<p>' + data.BOOKNAME +'

'添加到api :{ onContentLoad : function(){ .....以查看是否可以输出内容，但我得到'数据未定义错误'

< / p>

使用HTML格式尝试输出此数据的正确方法是什么？

Answer 1

从qTip forums开始，作者似乎在api回调中添加了一个ajax调用。也许这会解决你的问题？

以下是他的例子：

$(this).qtip({
 content: 'Loading...',
 api: {
  onRender: function()
  {
   // Setup your AJAX request here
   $.ajax({
    url: DOC_ROOT + "admin/ajax/tooltip_process.php",
    type: 'GET';
    contentType: "application/json charset=utf-8",
    dataType: "json",
    success: function(json) {
     if(json[0].result == 'success') return json[0].tip;
     else alert('^$%#$#$');
    }
   });
  }
});

Answer 2

您必须在请求中将dataType指定为json。它告诉jquery将响应视为json，以便您可以在当前使用它时使用它。此外，一旦您将数据作为子项获取，您就可以创建要显示的HTML。

Answer 3

这是另一种情况，当请求调试输出打开时，ColdFusion调试器会导致ajax错误。这是我们在使用ColdFusion并启用调试时需要记住的一个重要“问题”。它打破了ajax。

如何在jQuery中输出JSON列

3 个答案: