0

このプラグインを使用して、コンテンツを ajax 経由でツールチップにロードしています。理解して使い始めるのはとても簡単です。これは、リンクにカーソルを合わせたときにコンテンツをツール ヒントに動的にロードする JSP ページです。

<!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 ファイルすべてがページにインポートされているかどうかを確認する方法はありますか?
次の構造は、css ファイルと jsp ファイルが存在する場所を示しています。css フィールドと js フィールドはWeb コンテンツフォルダー内にあり、jsp ファイルは
WEB CONTENT
      WEB-INF
      JSP FILES にあります。
CLUETIP CSS と JAVASCRIPTFILES..


これがスクリーンショットです。ご覧のとおり、jsフィールドがロードされていません。ただし、css ファイルは取得されています。 ここに画像の説明を入力

EDIT#1
ページはdiv内のajaxを介してロードされます。そのため、ページのソースを表示をクリックしても、div 内のもののソース コードは表示されません。

EDIT#2 CDNを使用している場合でも、ファイルがインポートされていません
。つまり、開発者ツールの [ネットワーク] タブでは、javascript ファイルが呼び出されません。私は頭の部分に行を与えました。jquery.jsscript src

4

1 に答える 1

3

編集:ここでの質問の編集に基づいて、何が起こっているかです。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、ファイルの 1 つでエラーが発生しているということです。これは、使用しているアプリケーションの開発者ツールに表示されるはずです。「cluetip」を存在しないjavascriptファイルに置き換えるこのフィドルで何が起こるかを見てください。Chrome 開発者コンソールは次のようになります。

ここに画像の説明を入力

于 2013-05-08T01:50:34.317 に答える