【问题标题】:SCRIPT5007: Unable to get property 'value' of undefined or null referenceSCRIPT5007:无法获取未定义或空引用的属性“值”
【发布时间】:2013-08-10 01:55:35
【问题描述】:

我有一个似乎在 IE10 中不起作用的 html 表单。当点击 go 按钮调试返回:“SCRIPT5007:无法获取未定义或空引用的属性'值'” 我已经在我的 html 页面中添加了这个标签

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9" />.

html 包含 myform 中频率的下拉菜单选项。在下拉菜单中选择任何选项后,我在 javascript 函数下方调用。

function chooseFreqMenu(freqValues,freqTexts)
{
    var cf = document.myform;
    var freq1=document.myform.freq.value; // freq1="d"
    alert(freq1);// displaying freq1 value is "d" (ex:selected 'd' in html dropdown)
// checking some condition for freqValues.
    for(var i=4;i<freqValues.length;i++)
            selectStr += '<option value="'+freqValues[i]+'">'+freqTexts[i]+'\n';
    }
    selectStr += '</select>';
    // Assinging the selectedStr to innerHTML. After this statement i am getting empty for freq1 value. 
    //Its working fine in IE<10 browsers
    document.all.freqSel.innerHTML = selectStr; 
    alert(freq1); // displaying freq1 value is empty.
}   

在将 myform 发送到 chooseFreqmenu 之前,myform 包含 freq value="d"(假设我在下拉列表中选择了 'd') 在上面的函数 myform 不包含 freq 值之后。 上述函数将 myform 传递给 buildQueryStr 之后。

function buildQueryStr(myform)
{

var freq=myform.freq.value; //Getting an error SCRIPT5007: Unable to get property 'value' of undefined or null reference in this line

//some other fields.

}

如何解决这个问题?

有什么建议吗??提前致谢。

【问题讨论】:

    标签: javascript html internet-explorer-10


    【解决方案1】:

    我认为 IE 10 不再支持使用 myform.freq.value 语法访问元素。

    访问元素的标准方法(包括 IE 在内的所有浏览器都支持)是使用 document.getElementById 函数

    function buildQueryStr(myform) {
    
        //var freq=myform.freq.value; //Getting an error SCRIPT5007: Unable to get property 'value' of undefined or null reference in this line
        var freq=document.getElementById("freq").value;
    
        //some other fields.
    }
    

    【讨论】:

    • 另一种方式是document.forms["myform"].elements["freq"],它使用元素名称。
    • 不过,最好还是致电document.getElementByIddocument.forms["myform"].elements["freq"] 依赖于 "myform" 中的元素 "freq",它会发生变化,然后代码会中断,而 document.getElementById 不会......
    • 在我看来,两者都一样好,一个在你有元素的唯一 ID 时很有用,另一个在你有多个形式的相同元素名称并且不想开始时很有用使用 ID。
    【解决方案2】:

    首先:你不应该使用document.all,而不是在 2013 年 :) 这是一个旧的 Microsoft 扩展,我认为它已被弃用。使用 getElementById。

    我认为您创建 selectStr 的方式有问题。您将使用它作为 Select 的 innerHTML :

    • 不应以&lt;/select&gt; 结尾。一个元素的结束标签不是它的 innerHTML afaik 的一部分
    • 你的&lt;option&gt;元素应该有结束标签

    我将更改以下代码:

    // checking some condition for freqValues.
    for(var i=4;i<freqValues.length;i++)
            selectStr += '<option value="'+freqValues[i]+'">'+freqTexts[i]+'\n';
    }
    selectStr += '</select>';
    

    进入这个:

    // checking some condition for freqValues.
    for(var i=4;i<freqValues.length;i++)
            selectStr += '<option value="'+freqValues[i]+'">'+freqTexts[i]+'</option>\n';
    }
    

    注意:我在某处读到,在 SELECT 控件上使用 innerHTML 具有真正依赖于浏览器的行为,即使使用格式正确的代码也是如此。我认为更强大的解决方案是使用 removeChild 和 addChild 动态删除和添加选项节点。

    【讨论】:

      【解决方案3】:

      问题与文档模式有关,IE11默认文档模式为IE7。

      在 IE Emulation 中使用 F12 可以更改文档模式 8,9 和 11

      您可以使用以下标记通过编程更改文档模式。

      对于 Internet Explorer 8 及更高版本,此:

      <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7" />   
      

      强制浏览器按照特定版本的标准呈现。 IE7及以下不支持。

      如果你用分号分隔,它会设置不同版本的兼容性级别。例如:

      <meta http-equiv="X-UA-Compatible" content="IE=7; IE=9" />
      

      将 IE7 和 IE8 呈现为 IE7,但将 IE9 呈现为 IE9。它允许不同级别的向后兼容性。但是,在现实生活中,您应该只选择以下选项之一:

      <meta http-equiv="X-UA-Compatible" content="IE=8" />
      

      这使得测试和维护变得更加容易。虽然通常更有用的版本是使用 Emulate:

      <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
      

      为此:

      <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
      

      它强制浏览器以最新版本的标准进行渲染。就像在 Google 的 CDN 上使用最新版本的 jQuery 一样,这是最新版本,但也可能会破坏您的代码,因为它不是固定版本。

      最后,考虑添加这个小花絮:

      <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
      

      添加“chrome=1”将允许网站在 ChromeFrame 中为拥有它的(智能)用户呈现,而不会影响其他任何人。

      `在此处输入代码

      `https://technet.microsoft.com/en-us/itpro/internet-explorer/ie11-deploy-guide/fix-compat-issues-with-doc-modes-and-enterprise-mode-site-list

      https://msdn.microsoft.com/library/ms533876(v=vs.85).aspx
      
      http://www.chromium.org/developers/how-tos/chrome-frame-getting-started
      

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2017-07-05
        • 1970-01-01
        • 2014-02-03
        相关资源
        最近更新 更多