亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何讓表單提交事件偵聽器在 js 中工作?

如何讓表單提交事件偵聽器在 js 中工作?

子衿沉夜 2022-09-29 15:25:12
我正在用普通的js替換一些jquery代碼,并且我在表單提交事件偵聽器上遇到了麻煩<!-- html --><form name="myForm">   <input type="text" name="name" />   <button type="button">Click me</button></form>/* jquery code that works */$myForm = $("form[name=myForm]")$("form button").on("click", function(e){   $myForm.submit()})$myForm.on("submit", function(e){  e.preventDefault()  console.log("Submitting form")  })/* vanilla js replacement */myForm = document.querySelector("form[name=myForm]")myForm.querySelector("button").addEventListener('click', function(){   myForm.submit()})myForm.addEventListener('submit',function(e){  e.preventDefault()  console.log("Submitting form")})在 vanilla js 中,表單提交事件偵聽器在以編程方式提交表單時似乎不會觸發。如何解決此問題?
查看完整描述

1 回答

?
白衣非少年

TA貢獻1155條經驗 獲得超0個贊

當您在 HTMLForm 元素上使用該方法時,不會觸發表單的提交事件偵聽器:.submit()

當用戶單擊提交按鈕(或 )或在編輯表單中的字段(例如 )時按下時,將觸發提交事件。直接調用該方法時,不會將事件發送到窗體。<input type="submit">Enter<input type="text">form.submit()

斷續器

您可以改用 .requestSubmit() 方法,該方法會觸發表單的 onsubmit 事件處理程序,并對表單執行約束驗證

/* vanilla js replacement */

myForm = document.querySelector("form[name=myForm]")

myForm.querySelector("button").addEventListener('click', function() {

  myForm.requestSubmit();

})


myForm.addEventListener('submit', function(e) {

  e.preventDefault()

  console.log("Submitting form");

})

<form name="myForm">

  <input type="text" name="name" />

  <button type="button">Click me</button>

</form>

此方法的主要缺點是,與 jQuery 的方法不同,請求提交() 的瀏覽器支持較弱。.submit()



查看完整回答
反對 回復 2022-09-29
  • 1 回答
  • 0 關注
  • 86 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號