Write applet from 0 (7) Operation of input input box

The operation of the input input box, get the focus to clear, get the input content to jump

First, write the method to be called in wxml, use bindfocus to trigger the event of getting the focus, and use bindinput to trigger the event of text input

<input class="input_text" type="text" bindfocus="clear" bindinput="inputselect" value="{{clear}}" />
      <button class="search_btn" bindtap="selecttoresult">搜索</button>

This method realizes the function by operating the data in the data when the focus is obtained and when the text input is triggered, and the action is triggered by bindtap,
so the data container must be declared in js first:

  data: {
    select:'五花肉',
    clear:'   五花肉',
  },


Next is the method of the above three actions

 selecttoresult:function(){
    if(this.data.select!='   ')
    {
    wx.navigateTo({
      url: '../result/result?action=selectkind&key='+this.data.select,
    });
    }
  },
//上面的方法是点击后获取下面inputselect写入data里的值然后跳转

 clear: function (e) {
    this.setData({
      clear: '   '
    })
  },
//这个方法是当获取焦点时,清空data里clear容器里的数据

 inputselect: function (e) {
    this.setData({
      select: e.detail.value
    })
  }
//这个方法是在触发输入动作时,把输入的内容写入data里的select容器里

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=325845989&siteId=291194637