jQuery .html()函数仅在开发人员工具显示

时间:2015-12-24 22:11:18

标签: jquery ajax internet-explorer

我有一个页面,可以添加,编辑和删除项目。这是由对服务器端代码的许多Ajax调用控制的,这些代码更新后端中这些项的数据,并在成功更新包含这些项列表的DOM元素。它在Chrome和Firefox的版本中运行良好我已经对它进行了测试。但是,当我在IE 11中测试它时,DOM元素的更新仅在我打开Developer Tools栏时才有效。首先,代码我使用:

function getItemList(){
        $.ajax({
            type: 'GET',
            url: 'ajax.cfc?method=getXtrasList&eventGUID=#session.activeUser.activeEvent#',
            async: false,
            success: function(results){
                $('#div-items').empty().html(results);                  
            },
            error: function() {
                alert('there is a problem');
            }
        });
    };

在页面加载时调用它,并且在向服务器端发送Ajax调用以添加或删除列表中的任何项目的任何函数成功时调用。 &#39;结果&#39;是Ajax调用中返回的HTML片段。我验证了回调是否成功并返回了预期的结果。此函数适用于页面加载,但不会更新从其他Ajax调用成功调用时选择的DOM元素(如为列表创建新项目的那个)。我从页面代码顶部的指令<!DOCTYPE html>开始。

我做了以下尝试解决此问题:

  1. 删除了所有控制台引用。
  2. 使用了以下指令和标签(第二组是我用来解决jQuery和IE9以及之前另一个项目中类似问题的那个):

    <!DOCTYPE html>
    <meta http-equiv="x-ua-compatible" content="IE=EDGE">
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <meta http-equiv="x-ua-compatible" content="IE=EDGE">
    
  3. 尝试在上述函数中使用.html(结果)和.empty()。append(results)代替.empty()。html(results)。

  4. 将数据类型设置为&#39; html&#39;,并尝试了json&#39;,jsonp&#39;和&#39;字符串&#39;。
  5. 设置async:true。我最初将其设置为false,以防止在列表更新之前进行任何进一步的交互。
  6. 在SIAF内部设置一个警报()成功。我在选择器之前和之后添加了它,并确保它没有挂在.html()函数上。
  7. 在try / catch块中将代码包装在SIAF中,如果抛出异常,则使用alert()。
  8. 我确定,因为它在IE中工作,如果我打开开发人员工具栏,这是一个兼容性问题,并且已经浏览了MSDN网站上的论坛和文档,这些都告诉我{{1指令应该有效,所以我有点难过。关于类似问题的其他论坛讨论表明,在我的Ajax调用中将dataType设置为&#39; html&#39;应该有用,因为IE通常无法推断出正确的dataType。

    那我在这里错过了什么?

1 个答案:

答案 0 :(得分:1)

我根据本文的建议找到了问题:Internet Explorer not rendering html returned from JQuery ajax post。 IE正在缓存页面加载时发出的Ajax调用的结果。虽然它没有解决这个问题,但当我添加属性&#39; cache:false&#39;我的Ajax调用检索项目列表,它现在用最新的结果更新DOM元素,而不是缓存的结果。