本文实例讲述了微信小程序实现动态设置占位符提示文字及按钮选中取消状态的方法。分享给大家供大家参考,具体如下:
效果图展示
通过绑定点击事件占位符方法,获取的值,通过js判断num等于几,然后通过<代码> class=" {{num==x # 63;“活跃”:“}}”表达式判断哪个标签处于选中状态(即蓝底白字);
js通过获取,设置输入输入框中占位符的动态值
wxml里的内容:
& lt;视图类=皉etrieve-list”比;
& lt; div类="选项"比;
& lt;跨越bindtap=罢嘉环眃ata-num=' 1 '数据键=" data-val=" class=" {{num==1 & # 63;“活跃”:“}}”在全部& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=' 2 '数据键=氨晏狻癲ata-val=邦选眂lass=" {{num==2 & # 63;“活跃”:“}}”在标题& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=数据键“3”=罢癲ata-val=癮b”class=" {{num==3 & # 63;“活跃”:“}}”在摘要& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=' 4 '数据键=吧昵肴恕癲ata-val=懊懒纭眂lass=" {{num==4 & # 63;“活跃”:“}}”在申请人& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=' 5 '数据键=吧昵牒拧眃ata-val=币桓觥袄?" {{num==5 & # 63;“活跃”:“}}”在申请号& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=' 6 '数据键=按砣恕眃ata-val=癮g)”class=" {{num==6 & # 63;“活跃”:“}}”在代理人& lt;/span>
& lt;/div>
& lt; div类="选项"比;
& lt;跨越bindtap=罢嘉环眃ata-num=' 7 '数据键=按砘沟膁ata-val=癮c”class=" {{num==7 & # 63;“活跃”:“}}”在代理机构& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=?”数据键=肮诺膁ata-val=皃n”class=" {{num==8 & # 63;“活跃”:“}}”在公开号& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=?”数据键='发明人“data-val=薄崩?" {{num==9 & # 63;“活跃”:“}}”在发明人& lt;/span>
& lt;跨越bindtap=罢嘉环眃ata-num=?0”数据键=白ɡㄈ说膁ata-val=皃a”class=" {{num==10 & # 63;“活跃”:“}}”在专利权人& lt;/span>
& lt;/div>
& lt;/view>
之前
js里的内容:
应用var=getApp ()
页面({
数据:{
占位符:“请输入”,
ph值:”,
num: 1、
关键:”,
}，
占位符:函数(e) {
var num=e.currentTarget.dataset.num
this.setData ({
ph值:this.data.placeholder + e.currentTarget.dataset.key
}）
this.setData ({
num: num
}）
}）
之前
希望本文所述对大家微信小程序开发有所帮助。
