jQueryのajaxるという読みHTMLデータをクロム

StackOverflow https://stackoverflow.com/questions/2550570

質問

私はドキュメントを編集するには、プファイルを読み込み別のHTMLデータファイル jQuery.ajax().それは、特定のタグのデータをHTMLファイルを使用テキスト内のタグを表示-ツール。

このアプリをHTMLファイル: 

<!DOCTYPE html
 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
<head>
<title>Test</title>

<style type="text/css">
<!--/* <![CDATA[ */
body {
  font-family : sans-serif;
  font-size : medium;
  margin-bottom : 5em;
}
a, a:hover, a:visited {
  text-decoration : none;
  color : #2222aa;
}
a:hover {
  background-color : #eeeeee;
}
#stat_preview {
  position : absolute;
  background : #ccc;
  border : thin solid #aaa;
  padding : 3px;
  font-family : monospace;
  height : 2.5em;
}
/* ]]> */-->
</style>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
//<![CDATA[

$(document).ready(function() {
  $("#stat_preview").hide();

  $(".cfg_lnk").mouseover(function () {
    lnk = $(this);
    $.ajax({
      url: lnk.attr("href"),
      success: function (data) {
        console.log (data);
        $("#stat_preview").html("A heading<br>")
                          .append($(".tool_tip_text", $(data)).slice(0,3).text())
                          .css('left', (lnk.offset().left + lnk.width() + 30))
                          .css('top', (lnk.offset().top + (lnk.height()/2)))
                          .show();
      }
    });
  }).mouseout (function () {
    $("#stat_preview").hide();
  });
});

//]]>
</script>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<h1>Test</h1>
<ul>
  <li><a class="cfg_lnk" href="data.html">Sample data</a></li>
</ul>
<div id="stat_preview"></div>
</body>
</html>

このデータをHTML

<!DOCTYPE html
 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US" xml:lang="en-US">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<h1>Test</h1>
  <table>
    <tr>
      <td class="tool_tip_text"> Some random value 1</td>
      <td class="tool_tip_text"> Some random value 2</td>
      <td class="tool_tip_text"> Some random value 3</td>
      <td class="tool_tip_text"> Some random value 4</td>
      <td class="tool_tip_text"> Some random value 5</td>
    </tr>
    <tr>
      <td class="tool_top_text"> Some random value 11</td>
      <td class="tool_top_text"> Some random value 21</td>
      <td class="tool_top_text"> Some random value 31</td>
      <td class="tool_top_text"> Some random value 41</td>
      <td class="tool_top_text"> Some random value 51</td>
    </tr>
  </table>
</body>
</html>

このとしての意図を、Firefox、Chrome(クロム5.0.356.0).

の console.log (data) 表示は空文字列、クロムのJavaScriptコンソール.Firefoxで開いているのがfirebugただし、表示データ全体のHTML.

私何かが足りない?任意のポインタ?

役に立ちましたか？

解決

のスポンサーではありません答えですが、道の調査と思い:

  1. データオブジェクトではなく文字列?) （粉を山にして真ん中のクロムコンソールなノウハウを表示します。きみの代替出力方法を試して、場の提供、'dataType'の設定は違います。
  2. の成功にコールバックと呼ばれるのは全クロム?このバグ、ウェブブラウザーのセキュリティ機能（クロスサイトスクリプティングの保護、javascriptを無効)のブロックします。
  3. 実験の静的バージョンをHTML/CSSコードを作っていることを確認してくださいので表示を適切に両方のブラウザを推奨いたします。
ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top