当前位置: 首页 > 编程笔记 >

vue点击input弹出带搜索键盘并监听该元素的方法

越飞语
2023-03-14
本文向大家介绍vue点击input弹出带搜索键盘并监听该元素的方法,包括了vue点击input弹出带搜索键盘并监听该元素的方法的使用技巧和注意事项,需要的朋友参考一下

1.遇到问题:

需要做一个点击input弹出带搜索的键盘。

解决:

input的type="search",可弹出带搜索的键盘。并监听搜索按钮,请求数据

<input @keyup.13="show()" type="search">

2.但是又遇到一个新的问题:

点击搜索之后键盘没有收回。

解决:

通过$refs获取input

监听搜索按钮,添加.blur()

<input @keyup.13=show() type="search" ref="input1">
show(){
 this.$refs.input1.blur();
}

3.测试时发现ios无法弹出带搜索的键盘

解决:

给input外加一层from

<form action="javascript:return true;">
 <input @keyup.13=show() type="search" ref="input1">
</form>
show(){
 this.$refs.input1.blur();
}

以上这篇vue点击input弹出带搜索键盘并监听该元素的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍Android监听软键盘弹出与隐藏的两种方法,包括了Android监听软键盘弹出与隐藏的两种方法的使用技巧和注意事项,需要的朋友参考一下 需求: 现在有一个需求是点击一行文本框,弹出一个之前隐藏的输入框,输入完成后按返回键或者其他的东西隐藏键盘和输入框,将输入框的内容填充到文本框中。 实现: 拿到这个需求的第一反应就是写一个监听来监听键盘的显示和隐藏来控制输入框的显示和隐藏,控制文本

  • 本文向大家介绍vue如何监听键盘事件?相关面试题,主要包含被问及vue如何监听键盘事件?时的应答技巧和注意事项,需要的朋友参考一下 方法 addEventListener

  • 本文向大家介绍vue监听键盘事件的相关总结,包括了vue监听键盘事件的相关总结的使用技巧和注意事项,需要的朋友参考一下 按键修饰符 在监听键盘事件时,我们经常需要检查详细的按键。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符: 你可以直接将 KeyboardEvent.key 暴露的任意有效按键名转换为 kebab-case 来作为修饰符。 为了在必要的情况下支持旧浏览器,Vue 提供了

  • 我已经使用自制软件设置了日志存储和弹性搜索。Logstash需要很长时间才能连接或启动。这就是我启动Logstash的方式(从另一个答案中添加了协议) 我用elasticsearch启动ES,在Logstash终端上得到的输出是: 使用里程碑2输入插件“udp”。这个插件应该是稳定的,但如果你看到奇怪的行为,请让我们知道!有关插件里程碑的更多信息,请参阅http://logstash.net/do

  • 本文向大家介绍Android实现弹出键盘的方法,包括了Android实现弹出键盘的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了Android实现弹出键盘代码,是一个非常实用的功能。代码非常简洁。分享给大家供大家参考。 具体功能代码如下: 希望本文所述对大家Android程序设计的学习有所帮助。

  • 本文向大家介绍vue监听用户输入和点击功能,包括了vue监听用户输入和点击功能的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了vue监听用户输入和点击的具体代码,供大家参考,具体内容如下 功能1:监听用户输入和点击,并实时显示, 功能2:点击发布,编辑页面隐藏,显示发布成功。 功能1 html代码: 使用:v-model监听,!submmited视图默认显示,注意监听option v