[問題] jquery 的 event.preventDefault()

看板Ajax作者 (4545454554)時間2年前 (2022/10/17 17:19), 2年前編輯推噓4(4014)
留言18則, 4人參與, 最新討論串1/1
各位好 我參考底下的教學 測試 event.preventDefault() https://api.jquery.com/event.preventdefault/ 如果是這樣寫 運作正常 https://jsfiddle.net/8aLs1nwd/ https://i.imgur.com/AEwikoq.png
如果 我把 $('#Submit1').click 移到 function PV() 裡面 就不能work 如下 https://i.imgur.com/AbTK7bp.png
https://jsfiddle.net/an594hkw/ 想請問 是哪裡寫錯了嗎? 謝謝 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 223.138.71.71 (臺灣) ※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1665998364.A.26B.html

10/17 17:56, 2年前 , 1F
沒有呼叫PV()函式,自然沒有產生功能
10/17 17:56, 1F

10/17 18:08, 2年前 , 2F
你把PV()寫好但沒有呼叫
10/17 18:08, 2F
不好意思 我擺了個大烏龍 我在jsfiddle 忘了加上 onclick="PV()" 但截圖是有的 jsfiddle已更正 如下 https://jsfiddle.net/an594hkw/ 奇怪的是 在jsfiddle onclick="PV()" 是可以work 但在我本機的html 如下 不能work https://www.sendspace.com/file/oqfo3y 請問 是哪裡出錯了嗎?

10/19 17:42, 2年前 , 3F
要先在script呼叫一次PV()套上監聽事件
10/19 17:42, 3F

10/19 17:43, 2年前 , 4F
然後你的寫法div得不到event事件
10/19 17:43, 4F
不好意思 請問 在script呼叫一次PV()套上監聽事件和div能得到event事件 要怎麼改? 另外 為什麼 jsfiddle 沒有這個問題 不用改就可以work呢? 謝謝

10/20 09:03, 2年前 , 5F
你不先呼叫一次
10/20 09:03, 5F

10/20 09:03, 2年前 , 6F
第一次按 預設跳轉還是會觸發
10/20 09:03, 6F

10/20 09:04, 2年前 , 7F
你可以想成同時做兩件事 1.預設跳轉 2.PV() 一起做
10/20 09:04, 7F

10/20 09:04, 2年前 , 8F
但你呼叫了 1.的預設跳轉就被取代變成你寫的PV()優先
10/20 09:04, 8F

10/20 09:05, 2年前 , 9F
jsfiddle沒問題要看網站有沒有針對功能修改
10/20 09:05, 9F

10/20 09:06, 2年前 , 10F
我覺得應該只是jsfiddle把submit跳轉頁面取消
10/20 09:06, 10F

10/20 09:07, 2年前 , 11F
所以雖然 1跟2同時觸發 但1跳轉jsfiddle沒執行
10/20 09:07, 11F

10/20 09:21, 2年前 , 12F
類似這樣吧 https://paste.ee/p/GWJ95
10/20 09:21, 12F

10/20 09:21, 2年前 , 13F
你原始寫法還有個問題是一直套上事件監聽
10/20 09:21, 13F
謝謝你 我再想看看 ※ 編輯: kisha024 (114.27.132.227 臺灣), 10/20/2022 22:34:54

10/24 17:30, 2年前 , 14F
我的理解是:你把onClcick事件結合PV(),第一次點擊才會產生
10/24 17:30, 14F

10/24 17:32, 2年前 , 15F
submit的事件監聽,所以不會符合你預期的情況work
10/24 17:32, 15F

12/19 15:36, , 16F
先瞭解button type=submit的作用,才知道為什麼要preventDe
12/19 15:36, 16F

12/19 15:36, , 17F
fault,你的click function做的事如果跟submit無關,就不要
12/19 15:36, 17F

12/19 15:36, , 18F
用submit
12/19 15:36, 18F
文章代碼(AID): #1ZJHuS9h (Ajax)
文章代碼(AID): #1ZJHuS9h (Ajax)