Re: [問題] js 更改按鈕執行的判斷結果

看板Web_Design作者 (無)時間8年前 (2017/02/22 18:50), 編輯推噓2(208)
留言10則, 2人參與, 最新討論串2/3 (看更多)
※ 引述《revo3512 (brands)》之銘言: : 版上各位前輩們好: : http://codepen.io/anon/pen/GWKoZW (code在此) : 爬文說location.assign可以指定....在按完按鈕後到連接到指定page, 但發現好像不是 : 每個網站都可以顯示出來(至少在codepen中,連w3c可以,連yahoo、google會空白) : →如果想要按下 "加入會員" 先判定表格是否有填寫好,ture 直接連到google首頁, : fause 則是停留在原本表單畫面,該怎麼寫呢? : 先謝謝大家>"< 有關表單的部分,不建議直接用js導向其他頁面 表單正常的用法是在form標籤裡面寫上要前往的後端程式網址, 後端程式利用http post傳來的資料,接收變數後做處理(通常是寫入資料庫) form標籤的用法可以參考w3c https://www.w3schools.com/tags/att_form_action.asp html第6行的<form>應該改成類似這樣,在action內填寫要連去的網址 <form action="/action_page.php" method="post"> 另外,html表單要傳送的話,有一個type="submit"可以使用, 預設的圖形是按鈕,按下去就會把表單送到action的網址 input要改成以下這種方式較好 <input type="submit" value="加入會員"> 你可能會發現input裡面的onclick="Send()"不見了,因為不建議放那邊 單純在input的按鈕上加onclick無法完全偵測到表單送出的事件 例如鍵盤的使用者,可以透過鍵盤的enter鍵直接觸發送出表單, 又或是單純用鍵盤的tab切換欄位,最後再用enter去按加入會員的按鈕, 以上兩者都可以迴避input onclick事件 建議參考w3c的用法,把驗證的js放在form標籤上 https://www.w3schools.com/js/js_validation.asp <form name="myForm" action="/action_page.php" onsubmit="return validateForm()" method="post"> 至於判斷表單有沒有填好,如果只是要檢查必填欄位或是長度什麼的, 不用自己寫,可以直接套用老牌的jQuery Validation Plugin 詳細內容可以參考這篇台大計中的教學 http://www.cc.ntu.edu.tw/chinese/epaper/0033/20150620_3307.html 最後的最後,除了前端靠js擋以外,後端也要驗證資料 前端驗證防君子,後端驗證防小人,不然很容易就被injection類的攻擊打爆了 -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 218.187.98.220 ※ 文章網址: https://www.ptt.cc/bbs/Web_Design/M.1487760640.A.0AA.html

02/22 20:46, , 1F
02/22 20:46, 1F

02/23 09:15, , 2F
謝謝nottt大! 會這樣寫是因為這個page是串google excel
02/23 09:15, 2F

02/23 09:16, , 3F
填寫的資料會傳送到google excel 自動填入,這部分也是
02/23 09:16, 3F

02/23 09:16, , 4F
可以這樣寫嗎?
02/23 09:16, 4F

02/23 09:18, , 5F
我是參考此篇:https://goo.gl/DgHZjk
02/23 09:18, 5F

02/23 09:18, , 6F
在google apps script建立好一個自動傳值到excel的程式
02/23 09:18, 6F

02/23 09:19, , 7F
在html上寫上form跟input後送出,會把資料送到excel中
02/23 09:19, 7F

02/23 09:20, , 8F
本來的做法是...送出後會出現 result=true
02/23 09:20, 8F

02/23 09:20, , 9F
但我想改的是送出時驗證欄位是否有填寫,送出後直接跳轉
02/23 09:20, 9F

02/23 09:20, , 10F
google首頁~
02/23 09:20, 10F
文章代碼(AID): #1OhMq02g (Web_Design)
文章代碼(AID): #1OhMq02g (Web_Design)