6

这是一篇长文，

前提

被要求帮助客户修复他们当前项目的一些错误。需要修复的是工作列表页面。您有一个作业列表，单击其中一个，如果激活了 JavaScript，则会进行 AJAX 调用以将作业的详细信息动态加载到现有元素 (DIV#emploi_details) 中。如果 JS 未激活，它只会重新加载包含作业详细信息的页面（不太重要）。

我跳上他们的实验室服务器在开发网站上工作。

问题

基本上，IE7（起初）没有显示通过 $().load() 加载的内容。IE6 与innerHTML 一起工作顺利。请求已发送，我每次都会收到回复。我收到数据，我可以 alert() 它并查看它，但内容的实际转储不起作用。Safari，火狐，没问题。我正在向其中加载信息的 DIV#emploi_details 元素有一个 CSS display:none; 在其样式表中，并在加载内容后显示（其他不那么重要的细节）。

show_emploi = function(id, succ_id)
{
    $('#emploi_details').fadeOut(800, function() {
        var $$ = $(this);

        $$.load('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
            if (isIE6) document.getElementById('emploi_details').innerHTML = data;
            $$.show();
        });
        $('#bgContent').fadeOut();
    });
}

解决方案

起初我的印象可能是 $().load() 只是在起作用，所以我将其更改为 $.get() 以更好地控制加载内容的操作。

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    $$.empty().append(data).show();
});

这行得通。在包括 IE6 和 IE7 在内的所有浏览器中。没问题。很奇怪，但你知道它是否有效且完全证明，不要问问题。

情节转折

现在这就是狗屎变得奇怪的地方。我认为该错误已修复并将解决方案应用于实时网站，但......它不起作用。IE只是不喜欢它。在尝试了 $.ajax 和所有其他类型的东西之后，我感到困惑，我最终将它用于实时网站：

$.get('emploi_<?php echo $data['lang']; ?>.php', { job_details: 1, ajax: 1, id: id, succ: succ_id, random: (new Date().getTime()) }, function(data, status){
    document.getElementById('emploi_details').innerHTML = data;
    $$.show();
});

它适用于所有浏览器，因为没有什么能像准系统 JS 那样完成工作。必要时，此修复程序也适用于开发网站。

'待续'

嵌入内容的功能中有些东西不是所有浏览器（显然是服务器）都没有点击。

总而言之，我的问题是 WTF 问题。我不明白为什么一个在一侧有效，而在另一侧无效，甚至为什么它一开始就不能正常工作（$（）.load（））。这显然不是不同的 jQuery 版本（1.2.6），因为这是我验证框架版本的第一直觉。

无论如何，有趣的神秘海事组织。

希望斯塔克兰的某个人有上帝赐予的答案。

谢谢

4

2 回答 2

2

我已经解开了这个谜题！这是我的问题的一个工作示例。诀窍是在第一次成功后调用另一个 AJAX，这将以某种方式覆盖 innerHTML 的问题。谢谢你们让我朝着正确的方向前进。

我希望这会帮助一些人，因为到目前为止我还没有看到一个可行的解决方案。我也会为此联系 jQuery：P

$.ajax({
url:'modifyarticle.php',
type:'POST',
data:{
 id:this.id,
 article:'something',
 mode:'single',
 action:'delete'},
cache:false,
success:function(msg) {
 alert(msg);$.ajax({
  url:'getall.php',
  type:'GET',
  cache: false, 
  success: function(data) {
   $('#output').html(data);
  }
 });
}});

敬礼

于 2009-08-27T20:21:04.127 回答
1

我想你必须在那里。以下是一些可能的失败点：

  • jQuery.clean：制作被添加到 DOM 的片段的函数。

    如果 doctype 不好，或者响应 HTML 在某些方面存在缺陷，导致 clean 函数失败，那么这可能是可能的，因此没有任何东西可以插入到 DOM 中。

  • jQuery.fn.append：将渲染的响应片段添加到 DOM。

    比方说，因为 jQuery 使用 appendChild 而不是 innerHTML 向 DOM 添加内容，所以一个 bug 会导致 IE 不知道 DOM 已更改并且不呈现信号更改。当您使用 innerHTML 时，这将被绕过。

    如果您已验证注入的 HTML 确实存在，您的问题尚不清楚。这可以通过以下方式进行测试：

    $$.empty().append(data);
alert( $$.parent()[0].innerHTML );
$$.show();

  • jQuery.fn.show()：显示结果。

    从您的问题中不清楚最终失败是因为内容没有被放入 DOM 中，还是只是没有被显示？如果容器有填充和背景，你看到了吗？

    show 函数比仅仅添加.style.display='block'元素更复杂。如果它认为它是隐藏的，它不会显示该元素，IE有时可能会有奇怪的想法。用手动设置显示替换 show() 会改变什么吗？

很明显，IE 对待 stage/dev 页面和 live 站点的方式是不同的。我的第一步是尝试发现它们之间的区别。HTTP 标题、编码、文档类型、额外的脚本、额外的 css，甚至是空格......一些看似微小的差异是导致此错误的原因。

在任何情况下，您都应该准备一个简化的测试用例，仅包含复制此错误所需的基本必需品。即使您没有找到您满意的解决方法，测试用例也应该与您的错误报告一起发送给 jQuery。

于 2009-07-17T23:32:51.510 回答