小程序输入框怎么设置选项

Ⅰ 微信小程序开发-下拉框选项select option写法

写小程序时候，经常遇到使用下拉框选项，不过每次都手写很麻烦，所有我就发一个例子吧，因为我包在其他模块中，所有样式不知道有没有复制全，大家见谅！

·

每一个值的高度等你们可以随意设置，看个人喜好。

这个原理很简单，首先准备一些标签，准备一张图片（展开与折叠用），数据绑定就不说了。
设置变量：selectShow， 控制下拉框列表是否显示隐藏，我设置的是高度，显示就设置高度，不显示就设置为0； index，设置显示第几个数据，默认可以设置为0，根据需求； selectData，你要选择的数据组[]；

当点击三角时候，设置下拉框option选项显示（高度）。当点击选项值的时候，设置全局变量的下标值，标签中会根据下标在数组中选中，绑定数据显示， 然后设置下拉框option选项不显示（高度0）。

option总高度设置，根据你有多少选项以及selectShow值是否显示，我设置的是小于5个时候默认高度325rpx,超过五个时候，选项组length 每一个50rpx，
height:{{selectShow?(selectData.length>5?325:selectData.length 50):0}}rpx;

这个是写的一个样式，我的图片是倒三角，当展开时候，添加一个样式，rotate180度。
class='select_img {{selectShow&&"select_img_rotate"}}' src='../../images/b2.png'

这个是我的选项内容是一组数组，所有我循环出来，顺便绑定一个数据到标签中data-index，也就是这个值在数组中的下标，点击时候获取方便用。然后添加一个事件catchtap='optionTap'。
wx:for='{{selectData}}' wx:key='this' data-index='{{index}}' catchtap='optionTap'

wxss样式：
不解释，，看设计需求写样式。不过大多通用。

写程序时候，很多地方会用到时间选项，送大家一个函数。获取一天时间分割数组。["00:00","00:05","00:10"....] 参数minute ，设置隔几分钟分割。时间格式你们可以自己改。

Ⅱ 灏忕▼搴忚剧疆鍦ㄥ摢閲

灏忕▼搴忕殑璁剧疆阃氩父浣崭簬鍏朵富鐣岄溃鎴栬呮槸阃氲繃鐗瑰畾镄勫叆鍙ｈ繘鍏ャ傚叿浣扑綅缃鍙鑳藉洜灏忕▼搴忕殑璁捐″拰寮鍙戣呯殑阃夋嫨钥屾湁镓涓嶅悓銆

涓鑸𨱒ヨ达纴褰扑綘镓揿紑涓涓灏忕▼搴忔椂锛屽叾涓荤晫闱浼氭彁渚涗竴绯诲垪镄勫姛鑳藉拰镎崭綔阃夐”銆备綘鍙浠ュ湪杩欎簺阃夐”涓镆ユ垒“璁剧疆”鎴栫被浼肩殑镙囩撅纴阃氩父瀹冧细浠ラ娇杞锲炬爣銆佹枃瀛楅摼鎺ユ垨钥呮槸鍦ㄨ彍鍗曟爮涓镄勪竴涓瀛愰”褰㈠纺鍑虹幇銆傜偣鍑昏繖涓镙囩炬垨锲炬爣锛屽氨鑳借繘鍏ュ皬绋嫔簭镄勮剧疆鐣岄溃銆

涓句釜渚嫔瓙锛屽亣璁句綘姝ｅ湪浣跨敤涓涓灏忕▼搴忔潵绠＄悊浣犵殑锅ュ悍鏁版嵁锛屼綘鍙鑳戒细鍦ㄤ富鐣岄溃镄勫簳閮ㄧ湅鍒颁竴涓“镟村”鎴栬“璁剧疆”镄勯夐”銆傜偣鍑昏繖涓阃夐”钖庯纴浣犱细琚甯﹀埌涓涓鏂扮殑椤甸溃锛屽湪杩欎釜椤甸溃涓娄綘鍙浠ヤ慨鏀逛釜浜轰俊鎭銆佽剧疆鐩镙囥佽皟鏁撮氱煡棰戠巼绛夈

姝ゅ栵纴链変簺灏忕▼搴忎细灏呜剧疆阃夐”闅愯棌鍦ㄦ洿娣辩殑灞傜骇涓銆傝繖阃氩父鏄涓轰简淇濇寔涓荤晫闱㈢殑绠娲侊纴钖屾椂璁╃敤鎴疯兘澶熶笓娉ㄤ簬灏忕▼搴忕殑镙稿绩锷熻兘銆傚湪杩欑嶆儏鍐典笅锛屼綘鍙鑳介渶瑕侀氲繃镣瑰嚮涓绯诲垪镄勯摼鎺ユ垨鎸夐挳锛屾墠鑳芥垒鍒拌剧疆阃夐”銆

镐讳箣锛屽皬绋嫔簭镄勮剧疆阃氩父浣崭簬鍏朵富鐣岄溃鎴栬呴氲繃鐗瑰畾镄勫叆鍙ｈ繘鍏ャ傚叿浣扑綅缃鍙鑳藉洜灏忕▼搴忕殑璁捐″拰寮鍙戣呯殑阃夋嫨钥屾湁镓涓嶅悓銆傚傛灉浣犳棤娉旷珛鍗虫垒鍒拌剧疆阃夐”锛屽彲浠ュ皾璇曞湪灏忕▼搴忓唴鎼灭储“璁剧疆”鎴栬呮煡鐪嫔府锷╂枃妗ｄ互銮峰彇镟村氭寚瀵笺傚悓镞讹纴镡熸倝灏忕▼搴忕殑浣跨敤鏂瑰纺鍜岀晫闱㈠竷灞锛屼篃鑳藉府锷╀綘镟村揩鍦版垒鍒拌剧疆阃夐”銆

Ⅲ 微信小程序怎样设置textarea文本域输入

输入代码

<textarea class="weui-textarea" placeholder="请输入文本" style="height: 3.3em" />

就可以设置了。

Ⅳ 请问怎么在小程序里实现输入框搜索查询呀

通过输入框输入文本信息进行搜索是常用的场景，今天就带大家一步步完成该功能。

效果展示

通过在事件中心中添加查询事件，同时为查询事件添加一个接口用于搜索结果的过滤，实现最终的搜索查询。

这样就可以实现输入框搜索查询的功能了。