微信小程序-form表單提交代碼實例
更新時間:2019年04月29日 10:57:01 作者:意外金喜
這篇文章主要介紹了微信小程序-form表單提交,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
效果
html代碼
<form bindsubmit="formSubmit" bindreset="formReset"> <view class="section section_gap"> <view class="section__title">是否公開信息</view> <switch name="isPub" /> </view> <view class="section"> <view class="section__title">手機(jī)號</view> <input name="phone" placeholder="手機(jī)號" /> </view> <view class="section"> <view class="section__title">密碼</view> <input name="pwd" placeholder="密碼" password/> </view> <view class="section section_gap"> <view class="section__title">性別</view> <radio-group name="sex"> <label> <radio value="男" checked/>男</label> <label> <radio value="女" />女</label> </radio-group> </view> <view class="btn-area"> <button formType="submit">提交</button> <button formType="reset">重置</button> </view> </form> <view wx:if="{{isSubmit}}"> {{warn ? warn : "是否公開信息:"+isPub+",手機(jī)號:"+phone+",密碼:"+pwd+",性別:"+sex}} </view>
css代碼
.section{ display: flex; flex-direction: row; margin: 20rpx; } .section view{ margin-right: 20rpx; } .btn-area{ margin: 20rpx; } button{ margin: 10rpx 0; }
js代碼
let app = getApp(); Page({ data: { isSubmit: false, warn: "", phone: "", pwd: "", isPub: false, sex: "男" }, formSubmit: function (e) { console.log('form發(fā)生了submit事件,攜帶數(shù)據(jù)為:', e.detail.value); let { phone, pwd, isPub, sex } = e.detail.value; if (!phone || !pwd) { this.setData({ warn: "手機(jī)號或密碼為空!", isSubmit: true }) return; } this.setData({ warn: "", isSubmit: true, phone, pwd, isPub, sex }) }, formReset: function () { console.log('form發(fā)生了reset事件') } })
以上所述是小編給大家介紹的微信小程序-form表單提交詳解整合,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關(guān)文章
Java 正則表達(dá)式學(xué)習(xí)總結(jié)和一些小例子
字符串處理是許多程序中非常重要的一部分,它們可以用于文本顯示,數(shù)據(jù)表示,查找鍵和很多目的.在Unix下,用戶可以使用正則表達(dá)式的強(qiáng)健功能實現(xiàn)這些 目的2012-09-09JavaScript實現(xiàn)向setTimeout執(zhí)行代碼傳遞參數(shù)的方法
這篇文章主要介紹了JavaScript實現(xiàn)向setTimeout執(zhí)行代碼傳遞參數(shù)的方法,分析了向setTimeout傳遞參數(shù)的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-04-04微信小程序把百度地圖坐標(biāo)轉(zhuǎn)換成騰訊地圖坐標(biāo)過程詳解
這篇文章主要介紹了微信小程序把百度地圖坐標(biāo)轉(zhuǎn)騰訊地圖坐標(biāo)過程詳解,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2019-07-07layer設(shè)置maxWidth及maxHeight解決方案
這篇文章主要介紹了layer設(shè)置maxWidth及maxHeight解決方案,非常不錯,具有一定的參考借鑒價值 ,需要的朋友可以參考下2019-07-07深入探討如何利用Canvas實現(xiàn)圖片壓縮與Base64轉(zhuǎn)換
隨著Web應(yīng)用的日益普及,圖片的處理和優(yōu)化已經(jīng)成為現(xiàn)代開發(fā)的關(guān)鍵部分,本文主要介紹了如何利用Canvas技術(shù),將圖片進(jìn)行壓縮,并將其轉(zhuǎn)換為Base64格式,感興趣的小伙伴可以學(xué)習(xí)下2023-10-10