vue项目中textarea阻止默认换行事件
·
需求如下:
textarea中,输入回车键时添加分号
分析需求,分下面几步
- 阻止默认回车换行
- 获取值并添加分号
<!-- 此处使用了Vue语法中的事件修饰符 keydown.enter -->
<!-- 使用keyup阻止默认事件不起作用 -->
<div id="app">
<textarea v-mode="text" @keydown.enter="submit"></textarea>
</div>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
<script>
new Vue({
el: 'app',
data(){
return {text: ""}
},
methods:{
submit(e){
// 浏览器阻止默认事件兼容
if (e.preventDefault) e.preventDefault();
else window.event.value = false;
// 修改值
let _ = this.text;
if (_.charAt(_.length-1) === ";") return
else this.text += ";"
}
}
})
</script>
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)