dom - 仅在 IE9+ 中调用 jquery document.ready 和 window.load 后 getElementById 不在 DOM 中

标签 dom internet-explorer-9 onload getelementbyid document-ready

当我运行我的页面时,getElementById 调用有时会找到元素,有时找不到。绝对是时间问题。这只发生在 IE9 而不是 IE 兼容模式(7 或 8),也不会发生在任何其他浏览器(Firefox、Opera、Safari 和 Chrome)中。无法创建 fiddle ,因为当我将页面剥离以适合 fiddle 并将其放入沙箱时,问题就消失了。我的 getElementById javascript 调用在 head 部分,据我所知,除非您等待它们准备好 DOM 或窗口加载,否则将无法在该点找到元素。我尝试将我的 getElementById javascript 包装在 jquery 的 $(document).ready 函数中,但这没有任何效果。我还尝试将它包装在 jquery 的 $(window).load 函数中,我认为它必须起作用,但这也没有效果。

如果我尝试使用此 window.onload 解决方案 ( addLoadEvent ) 等待元素,我会工作并找到它。那么为什么不使用 jquery 的 document.ready 或 window.load API 呢?

我确实尝试将脚本在页面中向下移动到它引用的标记的 html 之后,但这没有任何效果,因为问题仍然存在并且找不到元素。我也把它移到了最后,但也没有效果。我对这个特定结果感到困惑,因为我认为将 javascript 移到最后会使这些元素可用(或者我读到的),但事实并非如此。有谁知道这是为什么吗?

我之前确实提到过它只发生在 IE9 中。此外,通常只有在初始页面加载时才会出现问题,并且任何页面刷新都会使问题消失。我猜可能是由于缓存。

我使用的是 asp.net 4.0,但这并不重要(或者我认为如此)。 javascript 位于 html 部分上方的 .aspx 页面中,而不是外部 js 文件中。我确实尝试将它移动到外部文件只是为了彻底,但这并没有达到预期的效果。

所以,总而言之,

  1. 为什么 jquery API 不工作?和
  2. 为什么将 javascript 移到页面下方(或末尾)也不起作用?

head 中的 Javascript 片段:

//        addLoadEvent(setupstuff);

//        function addLoadEvent(func)
//        {
//            var oldonload = window.onload;

//            if (typeof window.onload != 'function')
//            {
//                window.onload = func;
//            }
//            else
//            {
//                window.onload = function ()
//                {
//                    if (oldonload)
//                    {
//                        oldonload();
//                    }
//                    func();
//                };
//            }
//        }

    var txtLocation = '<%=txtLocation.ClientID%>';

    // JQuery plugin - JQueryLive (waits for element)
    $('#' + txtLocation).livequery(function ()
    {
        setupstuff();
    });


    //$(document).ready(function () //didn't work
    //$(window).load(function() //didn't work
    function setupstuff()
    {
        // search text watermark toggling
        var hasWatermark = $('#' + txtLocation).hasClass('txtLocationWatermark');

        var searchText;
        if (document.getElementById(txtLocation))
        {
            searchText = document.getElementById(txtLocation).value;
        }
        else
        {
            alert('Element ' + txtLocation + ' not found in DOM!');
            return;
        }
        //var searchText = $('#' + txtLocation).val(); //doesn't work either

最佳答案

升级到最新版本的 jQuery 解决了这个问题,因为在发行说明中记录的带有 .ready() 函数的先前版本之一(jQuery 1.7.?)中存在错误。

关于dom - 仅在 IE9+ 中调用 jquery document.ready 和 window.load 后 getElementById 不在 DOM 中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12412884/

相关文章:

css - 将 div 标签注入(inject)每个 <a> 链接

html - 具有 100% 高度行和 Internet Explorer 9 的表格

html - IE9 float 重复/删除错误?

javascript - 仅在 IE9 中不支持方法 compareDocumentPosition

jquery - 如何在页面加载时让这个 div 淡入?

javascript - 如何使用 jQuery 动态添加外部脚本?

php - 添加 xmlns 时出错 :xsi attribute namespace to root element

JavaScript IF 语句错误地评估 TRUE - 为什么?

angular - angular2中如何动态添加克隆节点(相当于cloneNode)

Javascript 图像大小和定位