本文实例讲述了微信小程序开发实现的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:" rel="external nofollow" 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:///zengzhan/qqzeng-ip

希望本文所述对大家微信小程序开发有所帮助。