Question

我们在这里遇到了IE11 / Chrome的一个奇怪问题。我们有这个小代码：

divFrmPost = document.getElementById('divFormPost'); 
divFrmPost.innerHTML = '<form name="formPost" method="post" \ action="http://someurl/servlet/myapp"> \    
    <input type="hidden" id="cd_user" name="cd_user" value="John Doe"> \    
    <input type="hidden" id="cod_user" name="cod_user" value="5013"> \    
    <input type="hidden" id="login" name="login" value="jdoe"> \    
    <input type="hidden" id="pwd" name="pwd" value="123456"> \    
    <input type="hidden" id="profile" name="profile" value="12"> \   
    <input type="hidden" id="" name="" value="128"> \
</form>'; 
frmPost = document.getElementById('formPost');
frmPost.submit();

当我们在IE11中运行它时，表单处理得很好，但是当我们在Chrome（v44）中运行它时，它什么都不做，并且在控制台中我们有这个错误：

Uncaught TypeError: Cannot read property 'submit' of null

我们理解问题必须是最后隐藏的字段，没有ID /名称，但为什么它在IE11中有效并且在Chrome中不起作用？

编辑：在原始代码中，innerHTML构造是一行，我编辑它以便更好地阅读，但我忘了把反斜杠。

EDIT2 ：请允许我们避免评论大战...

Answer 1

让它发挥作用

首先，我们必须编辑代码才能使其工作：正如其他人所说，你正在寻找身份证，但在表格上只有名称集，而Chrome和其他真正的浏览器并不喜欢它。

＆＃13;

divFrmPost = document.getElementById('divFormPost');
divFrmPost.innerHTML = '<form id="formPost" method="post" action="http://someurl/servlet/myapp">'    
   + '<input type="hidden" id="cd_user" name="cd_user" value="John Doe">'    
   + '<input type="hidden" id="cod_user" name="cod_user" value="5013">'    
   + '<input type="hidden" id="login" name="login" value="jdoe">'    
   + '<input type="hidden" id="pwd" name="pwd" value="123456">'    
   + '<input type="hidden" id="profile" name="profile" value="12">'    
   + '<input type="hidden" id="" name="" value="128">'
+'</form>';
frmPost = document.getElementById('formPost');
frmPost.submit();

＆＃13;

<div id="divFormPost"></div>

＆＃13;

多行字符串

要在多行上连接字符串，您应该使用+

为什么它适用于IE？

这里的答案

getElementById方法＆lt; IE 8

返回对具有指定ID或NAME属性值的第一个对象的引用。

来自MSDN Microsoft getElementById method

也许它因为this而在IE 11上为你工作，如果你没有定义<!DOCTYPE> IE启用Quirks模式

Quirks模式通过支持早期版本的Internet Explorer中的行为来强调与标准兼容性的兼容性。

Answer 2

更改

name="formPost"

到

id="formPost"

或使用

getElementsByName();

您的代码将是

 divFrmPost = document.getElementById('divFormPost'); 
divFrmPost.innerHTML = '<form id="formPost" method="post" action="http://someurl/servlet/myapp">    
    <input type="hidden" id="cd_user" name="cd_user" value="John Doe">    
    <input type="hidden" id="cod_user" name="cod_user" value="5013">    
    <input type="hidden" id="login" name="login" value="jdoe">    
    <input type="hidden" id="pwd" name="pwd" value="123456">    
    <input type="hidden" id="profile" name="profile" value="12">    
    <input type="hidden" id="" name="" value="128">
</form>'; 
frmPost = document.getElementById('formPost');
frmPost.submit();

Answer 3

两个问题：

您不能通过传统的字符串表示法将多行中的字符串拆分。我将其更改为Template String。您可以在行的末尾添加+以获得IE兼容性。
您表单没有ID。所以我添加了它。 <form id="formPost" name="formPost" ...

以下是工作代码：

        divFrmPost = document.getElementById('divFormPost'); 
        divFrmPost.innerHTML = `<form id="formPost" name="formPost" method="post" action="http://someurl/servlet/myapp">;    
            <input type="hidden" id="cd_user" name="cd_user" value="John Doe">    
            <input type="hidden" id="cod_user" name="cod_user" value="5013">    
            <input type="hidden" id="login" name="login" value="jdoe">    
            <input type="hidden" id="pwd" name="pwd" value="123456">    
            <input type="hidden" id="profile" name="profile" value="12">    
            <input type="hidden" id="" name="" value="128">
        </form>`; 
        frmPost = document.getElementById('formPost');
        frmPost.submit();

Javascript代码在IE11中运行但在Chrome中没有

3 个答案:

让它发挥作用

多行字符串

为什么它适用于IE？