本文实例讲述了微信小程序实现动态设置placeholder提示文字及按钮选中取消状态的方法。分享给大家供大家参考,具体如下:

效果图展示

微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法 微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法 微信小程序实现动态设置placeholder提示文字及按钮选中/取消状态的方法

通过绑定点击事件placeholder方法,获取data-num的值,通过js判断num等于几,然后通过class="{{num==X"表达式判断哪个标签处于选中状态(即蓝底白字);

js通过获取data-key,设置input输入框中placeholder的动态值

wxml里的内容:

<view class="retrieve-list">
  <div class="option">
    <span bindtap="placeholder" data-num='1' data-key='' data-val='' class="{{num==1">全部</span>
    <span bindtap="placeholder" data-num='2' data-key='标题' data-val='ti' class="{{num==2">标题</span>
    <span bindtap="placeholder" data-num='3' data-key='摘要' data-val='ab' class="{{num==3">摘要</span>
    <span bindtap="placeholder" data-num='4' data-key='申请人' data-val='ap' class="{{num==4">申请人</span>
    <span bindtap="placeholder" data-num='5' data-key='申请号' data-val='an' class="{{num==5">申请号</span>
    <span bindtap="placeholder" data-num='6' data-key='代理人' data-val='ag' class="{{num==6">代理人</span>
  </div>
  <div class="option">
    <span bindtap="placeholder" data-num='7' data-key='代理机构' data-val='ac' class="{{num==7">代理机构</span>
    <span bindtap="placeholder" data-num='8' data-key='公开号' data-val='pn' class="{{num==8">公开号</span>
    <span bindtap="placeholder" data-num='9' data-key='发明人' data-val='in' class="{{num==9">发明人</span>
    <span bindtap="placeholder" data-num='10' data-key='专利权人' data-val='pa' class="{{num==10">专利权人</span>
  </div>
</view>

js里的内容:

var app = getApp()
Page({
 data: {
  placeholder:'请输入',
  ph:'',
  num:1,
  key:'',
 },
 placeholder:function(e){
  var num = e.currentTarget.dataset.num
  this.setData({
   ph: this.data.placeholder+e.currentTarget.dataset.key
  })
  this.setData({
   num: num
  })
})

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

标签:
微信小程序,动态设置,placeholder,提示文字,按钮,选中,取消,状态

免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件! 如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com

《魔兽世界》大逃杀!60人新游玩模式《强袭风暴》3月21日上线

暴雪近日发布了《魔兽世界》10.2.6 更新内容,新游玩模式《强袭风暴》即将于3月21 日在亚服上线,届时玩家将前往阿拉希高地展开一场 60 人大逃杀对战。

艾泽拉斯的冒险者已经征服了艾泽拉斯的大地及遥远的彼岸。他们在对抗世界上最致命的敌人时展现出过人的手腕,并且成功阻止终结宇宙等级的威胁。当他们在为即将于《魔兽世界》资料片《地心之战》中来袭的萨拉塔斯势力做战斗准备时,他们还需要在熟悉的阿拉希高地面对一个全新的敌人──那就是彼此。在《巨龙崛起》10.2.6 更新的《强袭风暴》中,玩家将会进入一个全新的海盗主题大逃杀式限时活动,其中包含极高的风险和史诗级的奖励。

《强袭风暴》不是普通的战场,作为一个独立于主游戏之外的活动,玩家可以用大逃杀的风格来体验《魔兽世界》,不分职业、不分装备(除了你在赛局中捡到的),光是技巧和战略的强弱之分就能决定出谁才是能坚持到最后的赢家。本次活动将会开放单人和双人模式,玩家在加入海盗主题的预赛大厅区域前,可以从强袭风暴角色画面新增好友。游玩游戏将可以累计名望轨迹,《巨龙崛起》和《魔兽世界:巫妖王之怒 经典版》的玩家都可以获得奖励。