通过ajax将内容加载到工具提示中

我使用this插件通过ajax将内容加载到工具提示中。理解并开始使用它非常简单。这是我的jsp页面，我希望将内容动态加载到悬停在链接上的工具提示中。
通过ajax将内容加载到工具提示中

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<%@ page language="java" contentType="text/html; charset=ISO-8859-1" 
    pageEncoding="ISO-8859-1"%> 


<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%> 

<html> 
<head> 
    <script src="jquery.js" type="text/javascript"></script> 
<script src="jquery.hoverIntent.js" type="text/javascript"></script> <!-- optional --> 
<script src="jquery.cluetip.js" type="text/javascript"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('a.basic').cluetip(); 
    }); 
    function web() 
    { 
     alert('asffdsr'); 
    } 
</script> 
</head> 
<table border="1"> 
<tr> 
<th>Question name</th> 
<th>Group ID</th> 
<th>opt1(#votes)</th> 
<th>opt2(#votes)</th> 
<th>opt3(#votes)</th> 
<th>opt4(#votes)</th> 
<tr> 

    <c:forEach var="questions" items="${questionslist}"> 

       <tr> 
        <td><a class="basic" href="http://www.google.com" rel="http://www.google.com" ><c:out value="${questions.question}"/></a></td> 
....

如果你看看上面的代码，在底部你会发现<a>标签与class = basic和页面被加载到通过AJAX工具提示是http://www.google.com 在头，你可以看到脚本SRC和JavaScript的功能。我已将所有js文件导入到包含jsp页面的文件夹中。
但由于某种原因，工具提示没有出现。这里有什么问题以及如何纠正？还有什么办法检查是否所有的3 js文件jave都被导入到页面中？
以下结构描述了css和jsp文件的存在位置。 CSS和JS领域存在的网页内容文件夹和jsp文件存在于
Web内容
WEB-INF
JSP文件..
CLUETIP CSS AND JAVASCRIPT文件..

这是截图。正如你所看到的，js字段是而不是被加载。但是正在检索css文件。 enter image description here

EDIT＃1
该页面通过AJAX加载一个div内部。所以在点击查看页面源代码时，我们看不到div内的东西的源代码。在开发工具的网络选项卡使用CDN即当

编辑＃2
的jquery.js文件不被进口甚至，没有对的JavaScript文件进行调用。我在头部提供了script src行。

来源

2013-05-05 Ashwin

你有没有接着说：HTTP？我可以想象各种跨域/跨域问题，这些问题会阻止工具提示被加载。 – Roonaan 2013-05-05 12:46:24

@Roonaan：也给我的测试脚本。即使这是问题，至少应该显示一个空的工具提示，对吗？ – Ashwin 2013-05-05 13:17:07

调试器（firebug，chrome调试器）的coonsole窗口中的任何错误？ – 2013-05-05 15:25:10

编辑：基于这里编辑的问题是怎么回事。当您通过Ajax加载页面上的内容时，该内容中的任何脚本标记都不会被执行。看到这个问题：Loading script tags via AJAX了解更多详情。请务必阅读所有答案，因为解决方案可能取决于您的特定场景。

原来的答案

你正在试图做的，从您的网站到另一个域名，google.com一个Ajax请求。这是浏览器不允许的，它被称为跨域请求。根据该qtip错误处理程序：

error: function(xhr, textStatus) { 
    if (options.ajaxCache && !caches[cacheKey]) { 
     caches[cacheKey] = {status: 'error', textStatus: textStatus, xhr: xhr}; 
    } 

    if (isActive) { 
     if (optionError) { 
      optionError.call(link, xhr, textStatus, $cluetip, $cluetipInner); 
     } else { 
      $cluetipInner.html('<i>sorry, the contents could not be loaded</i>'); 
     } 
    } 
}

你应该得到以下几点：<i>sorry, the contents could not be loaded</i>加载到您的工具提示（见jsfiddle）。检查错误控制台，最明显的答案是，您的文件之一出现404错误，应该显示在您使用的任何应用程序的开发人员工具中。看看这个fiddle发生了什么，我用一个不存在的JavaScript文件替换'cluetip'。 Chrome开发者控制台看起来是这样的：在您的测试脚本// www.google.com`的计算器而已，或者也：

enter image description here

来源

2013-05-08 01:50:34

我没有收到工具提示 – Ashwin 2013-05-08 18:13:18

主要问题是我没有收到工具提示。我也试着在同一个域中加载一个页面。工具提示本身没有被显示。 – Ashwin 2013-05-08 18:22:45

您是否检查过cluetip脚本和css是否正确加载？ – 2013-05-08 18:51:17

通过ajax将内容加载到工具提示中

回答

相关问题