JQuery AJAX, кажется, не читает данные HTML в Chromium - PullRequest
2 голосов
/ 31 марта 2010

У меня есть файл HTML (приложение), который читает другой файл 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 (Chromium 5.0.356.0).

console.log (data) отображает пустую строку в консоли JavaScript Chromium. Firebug в Firefox, однако, отображает все данные HTML.

Я что-то упустил? Есть указатели?

1 Ответ

0 голосов
/ 31 марта 2010

Не уверен в ответе, но несколько направлений исследования, о которых я мог подумать:

  1. Являются ли данные объектом (а не строкой)? Может быть, консоль Chromium не знает, как ее отобразить. Вы можете попробовать альтернативный метод вывода, чтобы проверить его, или посмотреть, имеет ли значение параметр «dataType».
  2. В Chromium вызывается коллбэк успеха? Это может быть ошибка или какая-то функция безопасности браузера (например, защита межсайтовых сценариев или отключение JavaScript), которая блокирует ее.
  3. Поэкспериментируйте со статической версией HTML / CSS, которую должен создавать ваш код, и убедитесь, что он правильно отображается в обоих браузерах.
...