在Javascript中找不到Form.submit

sar*_*ake 1 javascript forms

HTML

<form id="myFrm" name="myFrm" action="/myApp/ProcessFrm" method="post">
    <input autofocus="autofocus" type="text" id="Location" name="Location" onkeydown="changetotab()" style="width: 4em" tabindex="1"  />
    <input type="Submit" value="Submit" id="submit" /> <br />
</form>
Run Code Online (Sandbox Code Playgroud)

JS

 function changetotab() {
            var charCode = (window.event.which) ? window.event.which : window.event.keyCode;

            if (charCode == 13 || charCode == 9) {
                if (document.myFrm.submit == undefined) {
                    alert("form submit can't be found")
                } else {
                    alert("form can be submitted");
                   document.myFrm.submit();
                }
            }
        }
Run Code Online (Sandbox Code Playgroud)

当用户按下TAB或ENTER时,document.myFrm.submit == undefined出现错误(到目前为止很好); 然后出现了一些奇怪的事情 - 当我到达document.myFrm.submit(); JS通知未找到此方法.

0x80020003 - JavaScript运行时错误:找不到成员.

这里发生了什么?

注意:我不能使用Jquery,以防万一你想知道我为什么使用旧式JS.这将在不支持Jquery的旧设备上运行.

Bol*_*wyn 9

看到这个JSfiddle.这里发生了什么?那么,在DOM前的时间,JavaScript的创建一个属性foo为每个input与名称fooinput的父form:

form.foo.toString() === "HTMLInputElement";
Run Code Online (Sandbox Code Playgroud)

但是,这意味着,如果您有一个带有名称的输入元素,则会覆盖submit表单自己的submit方法.这种行为一直持续到今天.

现在,您的输入没有name属性.在这种情况下,行为是从inputID中推导出一个,如果设置了一个.所以基本上,改变它的ID input,这是最直接的处理方式:

<input type="Submit" value="Submit" id="submit_" />
Run Code Online (Sandbox Code Playgroud)

不幸的是,有很多这样的微妙之处.有关概述,请参阅DOMLint.

编辑:怎么做,如果你最终得到一个破坏submit方法,无法改变HTML?然后从表单的原型中获取submit方法并使用:

// form.submit() doesn't work, but this will:
HTMLFormElement.prototype.submit.call(form);
Run Code Online (Sandbox Code Playgroud)