Question

我想与班级＆＃34;工具提示＆＃34;加载包含他们链接到的页面的工具提示，这是我从http://jsfiddle.net/craga89/L6yq3/获得的代码，但由于某种原因它无法正常工作..

＆＃13;

		<script>
			// Create the tooltips only when document ready
 $(document).ready(function()
 {
     // MAKE SURE YOUR SELECTOR MATCHES SOMETHING IN YOUR HTML!!!
     $('.tooltip').each(function() {
         $(this).qtip({
            content: {
                text: function(event, api) {
                    $.ajax({
                        url: api.elements.target.attr('href') // Use href attribute as URL
                    })
                    .then(function(content) {
                        // Set the tooltip content upon successful retrieval
                        api.set('content.text', content);
                    }, function(xhr, status, error) {
                        // Upon failure... set the tooltip content to error
                        api.set('content.text', status + ': ' + error);
                    });
        
                    return 'Loading...'; // Set some initial text
                }
            },
            position: {
                viewport: $(window)
            },
            style: 'qtip-wiki'
         });
     });
 });                                               
		</script>

＆＃13;

Answer 1

您可以在工具提示中显示您想要的任何内容。

你有.then回调并且里面有所有请求的内容。

.then(function(content) {
    // Set the tooltip content upon successful retrieval
    var img = $(content).find('img'); // Get particular image from response html
    api.set('content.text', img); // Show that image
 }, function(xhr, status, error) {
     // Upon failure... set the tooltip content to error
     api.set('content.text', status + ': ' + error);
 });

http://jsfiddle.net/L6yq3/3007/

如何在qtip工具提示中加载页面

1 个答案: