javascript - 在 IE 中设置 DOM 创建元素的名称失败——解决方法？

Question

今天我有点难过:

function mk_input( name, val ) {
    var inp = document.createElement( 'input' );
    inp.name = name;
    inp.value = val;
    inp.type = 'hidden';

    return inp;
}

事实证明，设置 name通过 createElement 创建的元素在 IE 中不起作用。它不会导致错误或任何事情，它只是无声地失败，让人思考为什么他们的隐藏字段没有被正确填充。

据我所知，没有解决方法。您必须硬着头皮创建 <input>通过字符串操作标记并将其粘贴在 .innerHTML 中相反。

有没有更好的方法？也许使用 jQuery 之类的东西？我粗略地搜索了一下，没有找到与 createElement 完全相似的内容。在 JQuery 中，但也许我错过了一些东西。

Answer 1

只是重申问题:在 IE 中，以编程方式设置 name通过 document.createElement('input') 创建的元素的属性未反射(reflect)在 getElementsByName 中, form.elements (如果附加到表格)，并且不与 form 一起提交(同样，如果附加到表格)[ Reference ].

这是我过去使用的解决方法(根据您的问题 from here 改编):

function mk_input( name, val ) {
    var inp;
    try {
        inp = document.createElement('<input type="hidden" name="' + name + '" />');
    } catch(e) {
        inp = document.createElement("input");
        inp.type = "hidden";
        inp.name = name;
    }
    inp.value = val;
    return inp
}

这类似于特征检测(与浏览器检测相反)。第一个createElement将在 IE 中取得成功，而后者将在符合标准的浏览器中取得成功。

当然还有 jQuery 等效项，因为您将问题标记为这样:

function mk_input( name, val ) {
    return $('<input type="hidden" name="' + name + '" />')
        .val(val)
        .get(0)
}

(作为旁注，jQuery 正在执行您在问题中描述的内容:它创建一个虚拟 <div> 并将其 innerHTML 设置为上面传递的 <input type="... 字符串)。

正如@jeffamaphone 指出的那样，这个错误已在 IE8 中修复。