当前位置：尊龙游戏旗舰厅官网 > 编程资源 > 编程问答 >内容正文

编程问答

微信小程序开发-尊龙游戏旗舰厅官网

发布时间：2025/1/21 编程问答 25 豆豆

尊龙游戏旗舰厅官网收集整理的这篇文章主要介绍了微信小程序开发-ip地址查询-例子小编觉得挺不错的,现在分享给大家,帮大家做个参考.

微信小程序开发小程序搜索框 ip地址查询搜索查询样例

微信小程序开发参考 https://mp.weixin.qq.com/debug/wxadoc/dev/component/

search.wxml

<view class="container"><view class="page-body"><view class="weui-search-bar {{searchfocuscss}}" id="searchbar"><view class="weui-search-bar__form"><view class="weui-search-bar__box"><icon class="weui-icon-search">icon><input type="text" class="weui-search-bar__input" id="searchinput" placeholder="输入ip" confirm-type="search" bindinput="bindkeyinput" bindconfirm="searchsubmit" value="{{searchvalue}}" focus="{{focus}}" /><a href="javascript:" class="weui-icon-clear" id="searchclear" bindtap="searchclearclick">a> view><view class="weui-search-bar__label" id="searchtext" bindtap="searchtextclick"><icon class="weui-icon-search">icon><view class="weui-search-bar__label_span">搜索（8.8.8.8）view>view>view><view class="weui-search-bar__cancel-btn" id="searchcancel" bindtap="searchcancelclick">取消view>view>view><view class="page-section"><view class="page-section-title"><text>查询结果text>view><view class="page-section-spacing"><scroll-view scroll-y="true" class="ip-scroll" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll" scroll-into-view="{{toview}}" scroll-top="{{scrolltop}}"><view class="scroll-view-item"><view class="view-item-ip"> {{r.ip}}view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.continent}}text>view><view class="weui-cell__ft">大洲view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.country}}text>view><view class="weui-cell__ft">国家view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.province}}text>view><view class="weui-cell__ft">省份view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.city}}text>view><view class="weui-cell__ft">城市view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.district}}text>view><view class="weui-cell__ft">县区view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.isp}}text>view><view class="weui-cell__ft">运营商view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.areacode}}text>view><view class="weui-cell__ft">行政区划view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.en}}text>view><view class="weui-cell__ft">国家英文view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.cc}}text>view><view class="weui-cell__ft">国家缩写view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.lng}}text>view><view class="weui-cell__ft">经度view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.lat}}text>view><view class="weui-cell__ft">纬度view>view><view class="weui-cell"><view class="weui-cell__bd"><text>{{r.version}}text>view><view class="weui-cell__ft">版本view>view>scroll-view><view class="ip-tip">滚动查看内容view>view>view> view>

search.js

page({data: {inputvalue: '',focus: false,searchfocuscss: '',r: []},onready: function () {var that = this;wx.request({url: 'https://www.qqzeng.com/ip',method: 'post',data: {ip: 'qqzengip'},header: { 'content-type': 'application/x-www-form-urlencoded' },success: function (res) {that.setdata({r: res.data.data})},fail: function () {// fail },complete: function () {// complete }})},searchtextclick: function () {this.setdata({ searchfocuscss: 'weui-search-bar_focusing', focus: true })},searchcancelclick: function () {this.setdata({ searchfocuscss: '', focus: false })},searchclearclick: function () {this.setdata({ searchvalue: '', focus: true })},bindkeyinput: function (e) {this.setdata({ inputvalue: e.detail.value })},//搜索提交searchsubmit: function () {var that = this;var ip = this.data.inputvalue;if (ip) {var isip = ip.match(/^([1-9]\d*|0[0-7]*|0x[\da-f] )(?:\.([1-9]\d*|0[0-7]*|0x[\da-f] ))(?:\.([1-9]\d*|0[0-7]*|0x[\da-f] ))(?:\.([1-9]\d*|0[0-7]*|0x[\da-f] ))$/i);if (!isip) {wx.showtoast({ title: 'ip格式不正确', image: '/images/tip.png' });return false;}wx.showtoast({title: '搜索中',icon: 'loading'});wx.request({url: 'https://www.qqzeng.com/ip',method: 'post',data: {ip: ip},header: { 'content-type': 'application/x-www-form-urlencoded' },success: function (res) {that.setdata({r: res.data.data})},fail: function () {// fail },complete: function () {// complete wx.hidetoast();}})}},onshareappmessage: function () {return {title: 'ip地址查询-qqzeng-ip',path: '/pages/ip/search',success: function (res) {// 分享成功 },fail: function (res) {// 分享失败 }}}})

search.wxss

@import "../common/weui.wxss";.page-section-spacing {margin-top: 0rpx; }.page-section-title {text-align: center;padding: 40rpx 0rpx 0rpx 0rpx;color: #9b9b9b;font-size: 36rpx; }@media (min-width: 320px) {.ip-scroll {height: 640rpx;} }@media (min-width: 360px) {.ip-scroll {height: 816rpx;} }@media (min-width: 375px) {.ip-scroll {height: 836rpx;} }@media (min-width: 384px) {.ip-scroll {height: 826rpx;} }@media (min-width: 414px) {.ip-scroll {height: 868rpx;} }.scroll-view-item {height: 90rpx;line-height: 90rpx;color: #000;border-bottom: 1px solid #eee;text-align: center;vertical-align: middle;margin: 0px 20px; }.view-item-ip {line-height: 90rpx;color: #2ab059;display: inline-block;font-size: 36rpx; }.weui-cell__bd {color: #2ab059; }.ip-tip {color: #eee;font-size: 20rpx;text-align: center;padding-top: 20rpx; }

app.json

{"pages": ["pages/ip/search","pages/about/info"],"window": {"backgroundtextstyle": "light","navigationbarbackgroundcolor": "#2ab059","navigationbartitletext": "ip地址查询","navigationbartextstyle": "#ffffff"},"tabbar": {"color": "#7a7e83","selectedcolor": "#2ab059","borderstyle": "#2ab059","backgroundcolor": "#ffffff","list": [{"pagepath": "pages/ip/search","iconpath": "images/location.png","selectediconpath": "images/location_hl.png","text": "ip查询"},{"pagepath": "pages/about/info","iconpath": "images/about.png","selectediconpath": "images/about_hl.png","text": "关于"}]} }

ssl证书

https 请求

tls 仅支持 1.2 及以上版本

尊龙游戏旗舰厅官网：https://www.qqzeng.com
演示：https://www.qqzeng.com/ip
开发：https://github.com/zengzhan/qqzeng-ip

总结

以上是尊龙游戏旗舰厅官网为你收集整理的微信小程序开发-ip地址查询-例子的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得尊龙游戏旗舰厅官网网站内容还不错，欢迎将尊龙游戏旗舰厅官网推荐给好友。

上一篇：《个体软件过程》—第1章1.1节什么是软
下一篇： python模块之re正则表达式