Почему ошибка is not a function?

Question

[heducose]

Почему выбивает ошибку?

document.getElementsByTagName('form').submit(function(event) {
  event.preventDefault()
})

Uncaught TypeError: document.getElementsByTagName(...).submit is not a function
    at Object.<anonymous> (bundle.js:941)
    at __webpack_require__ (bundle.js:20)
    at bundle.js:63
    at bundle.js:66

Answer 1

[twobomb]

Нет такой функции submit. Пробуй onsubmit или через

document.getElementsByTagName('form').addEventListener("submit",function(e){},false);

PS. document.getElementsByTagName возвращает массив поэтому либо циклом переберите все элементы и повесьте событие, либо выберите только первый

document.getElementsByTagName('form')[0].addEventListener("submit",function(e){},false);

это вам не JQUERY

Comments

[heducose]

Упс, это из jQuery? Как заменить ванилла JS?

[twobomb]

heducose:

var forms = document.getElementsByTagName('form');
for(var i = 0; i < forms.length; i++)
forms[i].addEventListener("submit",function(e){
  e.preventDefault()
},false);

[heducose]

twobomb: WTF, зачем там for loop?

[heducose]

Это типо, для всех форм на странице?

[twobomb]

heducose: Что за loop? А for для перебора коллекции.

[heducose]

Так мне надо не только превент дефолт, а еще и это туда:

axios.post('/', {email: '[e-mail]'})
  .then((res) => {
    console.log(res.data)
  })

[twobomb]

heducose: Ну да, ты же по тегу выбирал

[twobomb]

heducose: Ну вставляй после или перед превент дефолт что хочешь

[heducose]

Разобрался, спасибо...Да, Javascript суров. Привыкли, понимаешь, к своим джеквери и вью.

[Stalker_RED]

Вместо
document.getElementsByTagName('form')[0] можно использовать
document.querySelector('form')

[Stalker_RED]

heducose: Не так уж он и суров, просто в jQuery слишком большая концентрация сахара :)

[heducose]

document.querySelector('form')

Насколько я понимаю, это использовать тогда, когда у нас только одна форма? Т,е. если мне нужно выбрать вторую форму, то это я не смогу применить?

[heducose]

Stalker_RED: я вообще Vue использую, и там вся эта конструкция заменяется добавлением в HTML тег модификатора аттрибута.prevent