How js organizes the default input pop-up boxes on the mobile side

problem description

now you want to customize the pop-up layer of an input box, hoping that the default input box will not be displayed when input gets focus

the environmental background of the problems and what methods you have tried

take the initiative to make inpu lose focus through input @ focus

related codes

/ / Please paste the code text below (do not replace the code with pictures)

  <div>
    <input type="number" @focus="stopPopUp" />
    <price-keyboard></price-keyboard>
  </div>

export default {
  methods: {
    stopPopUp(e){
      let target = e.target
      target.blur()
    }
  },
}

what result do you expect? What is the error message actually seen?

expect that the default pop-up box does not appear. Now scan the h5 with Alipay and find that everything is normal, but when using Wechat, you find that if you quickly click on the input, pop-up box 2 times, sometimes it will still appear, although it is only occasional, but the experience is very poor. Is there any other way to prevent the pop-up box from appearing?

Jun.01,2021

since this is the requirement, why do you want to use input, and use div? it can save a lot of trouble


use disabled, and then use click

.
Menu