id
または name
属性が submit
となっている入力項目(input, select タグなど)が form タグ内に存在する場合、その form の submit()
関数を実行すると、
Uncaught TypeError: Property 'submit' of object #<HTMLFormElement> is not a function
というエラーが発生する。
<form id="form-1">
</form>
<form id="form-2">
<input type="button" id="submit" />
</form>
<form id="form-3">
<input type="button" name="submit" />
</form>
<form id="form-4">
<div id="submit"></div>
</form>
<form id="form-5">
<select id="submit"></select>
</form>
console.log(document.getElementById('form-1').submit);
// > function submit() { [native code] }
console.log(document.getElementById('form-2').submit);
// > <input type="button" id="submit" />
console.log(document.getElementById('form-3').submit);
// > <input type="button" name="submit" />
console.log(document.getElementById('form-4').submit);
// > function submit() { [native code] }
console.log(document.getElementById('form-5').submit);
// > <select id="submit"></select>
id
または name
が submit
となっている入力項目タグが存在する場合、 form の submit
プロパティは関数ではなく、当該タグの DOM オブジェクトを指してしまっている。
今回このエラーに遭遇したときは、 jQuery の submit()
関数を使用していたが、これも結局は内部で form タグの submit プロパティを関数として実行しようとしているので、同じようにエラーになってしまう。