推荐下载
-
2020-05-12 浏览：740
-
2020-05-06 浏览：521
-
2020-05-08 浏览：510
-
2020-04-04 浏览：504
-
2020-05-12 浏览：500
小程序根据input输入，动态设置按钮的样式
发布时间:2020-12-24
【需求】实现当手机号已填写和协议已勾选时，“立即登录”按钮变亮，按钮可点击；若有一个不满足，按钮置灰，不可点击；实现获取短信验证码，倒计时提示操作；对不满足要求内容进行toast弹窗提示。 ...
【需求】实现当手机号已填写和协议已勾选时，“立即登录”按钮变亮，按钮可点击；若有一个不满足，按钮置灰，不可点击；实现获取短信验证码，倒计时提示操作；对不满足要求内容进行toast弹窗提示。
<view class="container"> <!--手机号--> <view class="section"> <text class="txt">手机号</text> <input value="{{mobile}}" placeholder-class="placeholder" placeholder="11位手机号码" type="number" maxlength="11" bindinput="mobileInput"/> </view> <!--图片验证码--> <view class="section"> <view> <text class="txt">图形验证码</text> <input placeholder-class="placeholder" placeholder="输入图形验证码" type="text" maxlength="4" bindinput="imgCaptchaInput"/> </view> <image class="imgBtn" src="{{imgCodeSrc}}" bindtap="getImgCode"></image> </view> <!--短信验证码--> <view class="section"> <view> <text class="txt">验证码</text> <input placeholder-class="placeholder" placeholder="输入验证码" type="number" maxlength="6" bindinput="smsCaptchaInput"/> </view> <view class="smsBtn" bindtap="getSMS">{{captchaText}}</view> </view> <view class="agree" style="margin-top:40rpx"> <checkbox-group bindchange="checkboxChange"> <checkbox class="check" value="1" checked="true" bindchange="checkboxChange"></checkbox> </checkbox-group> <span>已阅读并同意</span> <text style="color:#98c7ff" bindtap="xieyi">《用户使用协议》</text> </view> <view class="regist {{phoneAll&&checkAgree?'active':''}}" bindtap="regist">立即登录</view> </view> <!--mask--> <view class="toast_mask" wx:if="{{isShowToast}}"></view> <!--以下为toast显示的内容--> <view class="toast_content_box" wx:if="{{isShowToast}}"> <view class="toast_content"> <view class="toast_content_text"> {{toastText}} </view> </view> </view>
js
- 上一篇：小程序基础篇之页面路由
- 下一篇：实战分享，蓝牙在小程序中的应用！
