button按鈕和submit按鈕有什麼不同?
這篇文章帶給大家的內容是關於button按鈕和submit按鈕有什麼不同?有一定的參考價值,有需要的朋友可以參考一下,希望對你有幫助。
button-普通按鈕,submit-提交按鈕。
submit是button的一個特例,也是button的一種,它把提交這個動作自動集成了,submit和button,二者都以按鈕的形式展現,看起來都是按鈕,所不同的是type屬性和處發響應的事件上。
使用場景:
這裡說的部分使用場景,並不是只能用一種,只是說,在這種場景下使用更方便,程式設計師工作量小。
用表格比較一下:
場景 | #button | submit |
---|---|---|
#網頁上需要提交資訊到伺服器 | √ | |
#網頁上執行一個普通的事件,如重設、清空功能。 | √ | |
提交表單 | 需要綁定事件才能提交表單資料 | √ |
局部刷新 | √ | 不可以使用,在觸發事件的同時會提交表單。 |
沒有表單,卻要提交資料 | 而button預設是不提交任何資料。可以綁定事件的方式來提交資料。 | submit需要有表單時,提交時才會帶資料。當然使用submit也可以,但前提要攔截onclick事件。 |
表單資料太多的時候 | 需要寫很多資料的取得動作 | 推薦 |
提交資料是要使用JS進行校驗的,但如果這時候用戶禁用了JS,那麼校驗就失效了,如果後台也沒有進行校驗,那麼不合法的數據就進入後台了。 | 推薦:透過button提交數據,那麼如果用戶禁用JS,那麼數據提交動作就激活不了 | 不推薦 |
1.在上面的場景中,表單在點擊提交按鈕後需要用JS進行處理(包括輸入驗證)後再提交的話,通常我們提倡用button,如果需要使用submit提交前驗證的話應在方法前加return。 onClick方法不加return 會自動提交,並不會起到約束的作用, 所以,使用submit時需要驗證請加 return true或false。
如一個登陸模組,先驗證使用者名稱是否為空,如果為空,SUBMIT點擊時永遠提交不到from表單指定頁面。只能是表單形式發送噢!而且不能再表單指定的頁面中去驗證傳進來的值。
function check(){ var name = document.getElementById("name").value; if(name == null || name == ''){ alert("用户名不能为空"); return false; } return true; } <form name="form" action="跳转的页面" method="post" onsubmit="return check()"> <input type="text" id="name"/> <input type="submit" value="提交"/>
以上是button按鈕和submit按鈕有什麼不同?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

在 Vue.js 中使用 Bootstrap 分為五個步驟:安裝 Bootstrap。在 main.js 中導入 Bootstrap。直接在模板中使用 Bootstrap 組件。可選:自定義樣式。可選:使用插件。

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML定義網頁結構,CSS負責樣式和佈局,JavaScript賦予動態交互。三者在網頁開發中各司其職,共同構建豐富多彩的網站。

React通過JSX與HTML結合,提升用戶體驗。 1)JSX嵌入HTML,使開發更直觀。 2)虛擬DOM機制優化性能,減少DOM操作。 3)組件化管理UI,提高可維護性。 4)狀態管理和事件處理增強交互性。

H5referstoHTML5,apivotaltechnologyinwebdevelopment.1)HTML5introducesnewelementsandAPIsforrich,dynamicwebapplications.2)Itsupportsmultimediawithoutplugins,enhancinguserexperienceacrossdevices.3)SemanticelementsimprovecontentstructureandSEO.4)H5'srespo

"h5"和"HTML5"在大多數情況下是相同的,但它們在某些特定場景下可能有不同的含義。 1."HTML5"是W3C定義的標準,包含新標籤和API。 2."h5"通常是HTML5的簡稱,但在移動開發中可能指基於HTML5的框架。理解這些區別有助於在項目中準確使用這些術語。

HTML、CSS和JavaScript在Web開發中的作用分別是:1.HTML定義網頁結構,2.CSS控製網頁樣式,3.JavaScript添加動態行為。它們共同構建了現代網站的框架、美觀和交互性。

HTML的未來充滿了無限可能。 1)新功能和標準將包括更多的語義化標籤和WebComponents的普及。 2)網頁設計趨勢將繼續向響應式和無障礙設計發展。 3)性能優化將通過響應式圖片加載和延遲加載技術提升用戶體驗。
