小程序写手机号码查吉凶，有检验手机号码正确性

先上图,再解释：

wxml:

<form  bindsubmit="formSubmit" class="form"><input name="tranNum" type="digit" placeholder="请输入手机号码"  class="tranNum" bindinput="checkNum"/><view class="err-view {{flag == true ? 'show' :'hidden'}}">请输入正确的手机号码view><button form-type="submit" class="btn-search">查吉凶button>
form>
<view class="result-view">查询结果是:view>
<view class="text-view">所在城市:{{city}}view>
<view class="text-view">主人个性:{{character}}view>
<view class="text-view">具体表现:{{characterdetail}}view>

wxss样式:

.form .tranNum{font-size: 28rpx;color: #666;height: 80rpx;width:96%;margin-left: 2%;line-height: 80rpx;text-align: center;border: 1px solid #d1d1d1;border-radius: 4rpx;margin-top: 100rpx;
}
.form .err-view{color: #d4361d;font-size: 12px;padding-left: 2%;margin:8rpx 0rpx; 
}
.form .show{display: block;
}
.form .hidden{display: none;
}
.form .btn-search{width: 40%;text-align: center;margin-top: 30rpx;height: 70rpx;line-height: 70rpx;font-size: 30rpx;
}
.result-view{font-size: 40rpx;color: #777;margin-top: 40rpx;padding-left: 2%;
}
.text-view{color: #00bba1;font-size: 26rpx;margin: 20rpx 0rpx;padding-left: 2%;line-height: 60rpx;
}
.fresh-na{color: #777;margin-left: 2%;font-size: 30rpx;margin-top: 40rpx;
}

js代码:

//index.js
//获取应用实例
var app = getApp()
Page({data: {flag:false,city:'',character:"",characterdetail:''},//事件处理函数bindViewTap: function() {wx.navigateTo({url: '../logs/logs'})},checkNum:function(e){var pattern = /[^\d]/g;var flag = pattern.test(e.detail.value);if(flag){this.setData({flag:true});}else{this.setData({flag:false})};},formSubmit: function(e) {var that = this;var num = e.detail;console.log(e.detail);var  url ='https://api.jisuapi.com/mobileluck/query?appkey=(ps：你的appkey)'; //请求的url地址;wx.request({url: url,data: {mobile:e.detail.value.tranNum},method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT// header: {}, // 设置请求的 headersuccess: function(res){if(res.data.msg == 'ok'){that.setData({city:res.data.result.city,characterdetail:res.data.result.characterdetail,character:res.data.result.character});}else{that.setData({flag:true});}console.log(res)},fail: function() {// fail},complete: function() {// complete}})console.log('form发生了submit事件，携带数据为：', e.detail.value.tranNum)},onLoad: function () {console.log('onLoad')var that = this//调用应用实例的方法获取全局数据app.getUserInfo(function(userInfo){//更新数据that.setData({userInfo:userInfo})})}
})

由于我请求的api是来自己与极速数据的，所以是私人的appkey。不方便透露，大家可以去注册一下，里面可以免费申请使用的。换成自己的appkey就可以啦

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！