سؤال

لدي ملف HTML (APP) يقرأ ملف HTML (بيانات) آخر عبر jQuery.ajax(). ثم يجد علامات محددة في ملف HTML للبيانات ويستخدم النص داخل العلامات لعرض نصائح أداة الفرز.

إليك ملف App 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 ، ولكن ليس في الكروم (Chromium 5.0.356.0).

ال console.log (data) يعرض سلسلة فارغة في وحدة التحكم JavaScript في Chromium. Firebug في Firefox ، ومع ذلك ، يعرض البيانات الكاملة HTML.

هل فاتني شيء؟ أي مؤشرات؟

هل كانت مفيدة؟

المحلول

لست متأكدًا من الإجابة ، ولكن بعض طرق التحقيق التي يمكن أن أفكر فيها:

  1. هل البيانات كائن (بدلاً من سلسلة؟) ربما لا تعرف وحدة التحكم Chromium كيفية عرضها. يمكنك تجربة طريقة إخراج بديلة لاختباره ، أو معرفة ما إذا كان توفير إعداد "نوع البيانات" يحدث أي فرق.
  2. هل يتم استدعاء رد الاتصال الناجح على الإطلاق في الكروم؟ قد يكون هذا خطأ ، أو ميزة أمان المتصفح (مثل حماية النكهة عبر المواقع ، أو تعطيل JavaScript) التي تمنعها.
  3. قم بتجربة نسخة ثابتة من HTML/CSS من المفترض أن تنتج الكود الخاص بك ، وتأكد من عرضه بشكل صحيح في كلا المتصفحين.
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top