2013-05-05 5 views
0

Я использую 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 В голове вы можете увидеть СРК сценарий и функции javascript. Я импортировал все js-файлы в папку, содержащую страницу jsp.
Но по какой-то причине всплывающая подсказка не появляется. Что здесь не так и как его исправить? А также есть ли способ проверить, были ли импортированы все 3 js-файлы на страницу?
Следующая структура описывает, где находятся файлы css и jsp. В CSS и JS поля присутствуют внутри содержимого папки веб и СПЯ файлы присутствуют в
WEB СОДЕРЖАНИЯ
            WEB-INF
            JSP FILES ..
CLUETIP CSS AND JAVASCRIPT ФАЙЛЫ ..



Это скриншот. Как видите, поля js: не загружено. Но файлы css извлекаются. enter image description here


РЕДАКТИРОВАТЬ # 1
страница загружается через AJAX внутри DIV. Таким образом, при нажатии кнопки просмотра страницы просмотра мы не можем видеть исходный код материала внутри div.

EDIT # 2
Файл jquery.js не импортируется даже при использовании CDN т.е. на вкладке сети инструмента разработчика, не вызов, сделанный для файла JavaScript в. Я дал строку script src в разделе главы.

+0

Вы добавили 'Http: // www.google.com' для StackOverflow только, или же в тестовом сценарии? Я могу представить себе все виды проблем с перекрестным происхождением/кросс-доменами, которые предотвратят загрузку всплывающей подсказки. – Roonaan

+0

@ Roonaan: К моему тестовому сценарию также. Даже если это была проблема, по крайней мере, должна отображаться хотя бы пустая подсказка, верно? – Ashwin

+0

Любые ошибки в окне coonsole вашего отладчика (firebug, chrome debugger)? –

ответ

3

EDIT: На основании изменений к вопросу здесь происходит то, что происходит. Когда вы загружаете контент на странице через Ajax, любые теги скрипта в этом контенте не будут выполнены. См. Этот вопрос: Loading script tags via AJAX для более подробной информации. Обязательно прочтите все ответы, так как решение может зависеть от вашего конкретного сценария.

Оригинал ответа

Вы пытаетесь сделать Ajax запрос с вашего сайта на другой домен, google.com. Это не разрешено браузерами, это называется запросом на кросс-домен. Согласовывающ в 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, где я заменяю 'cluetip' на несуществующий файл javascript. Консоль разработчика Chrome выглядит следующим образом:

enter image description here

+0

Я не получаю подсказку на всех – Ashwin

+0

Основная проблема заключается в том, что я не получаю всплывающую подсказку. Я также попытался загрузить страницу в том же домене. Сам всплывающая подсказка не отображается. – Ashwin

+0

Вы проверили, правильно ли загружен скрипт cluetip и css? –

Смежные вопросы