element 输入框禁止输入空格以及复制的值进去删除空格(vue自定义指令)开箱即用

实例图:

在这里插入图片描述
在这里插入图片描述

代码:

//输入框禁止输入空格
Vue.directive('noSpace', {bind(el) {//禁止输入空格el.addEventListener("keydown", function (event) {if (event.keyCode === 32) {event.preventDefault();}});//复制值时去掉空格el.addEventListener("paste", function (event) {event.preventDefault();let text = event.clipboardData.getData('text/plain');document.execCommand("insertText", false, text.replace(/\s/g, ""));});},
});

使用:

<el-input size="medium" v-model="searchItem2" placeholder="请输入"  v-no-space>  </el-input>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/10252.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

node——使用localtunnel做内网穿透

前言 内网穿透是一种允许外网用户访问内网主机的技术。 将您的本地主机公开到世界各地&#xff0c;使之能访问&#xff0c;无需混淆DNS或部署。 内网穿透技术通常涉及以下几个关键步骤&#xff1a; 使用公网服务器或NAT&#xff08;网络地址转换&#xff09;设备&#xff1a;这…

「51媒体」邀请媒体参会报道和媒体发稿有啥不同

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体网胡老师。 媒体参会报道和媒体发稿是新闻报道的两种不同形式&#xff0c;它们的主要区别在于内容来源、报道方式和目的。 内容来源&#xff1a; 媒体参会报道&#xff1a;通常指的是记者或媒体代…

火绒安全原理、用法、案例和注意事项

火绒安全是一款功能强大的安全软件&#xff0c;它采用了先进的安全技术和算法&#xff0c;通过实时监测、恶意代码识别、防火墙功能、沙箱技术和网络保护等多种手段&#xff0c;为用户提供全面的计算机安全防护。 1.为什么选用火绒安全&#xff1f; 火绒安全是一款优秀的安全软…

2024年第九届数维杯大学生数学建模挑战赛B 题思路1.0版本

B题&#xff1a;生物质和煤共热解问题的研究 数维杯分享资料&#xff08;问题一代码论文思路&#xff09;链接&#xff08;18点更新&#xff09;&#xff1a; 链接&#xff1a;https://pan.baidu.com/s/1GSv9dkqcY6G-XUnd0sJe_A 提取码&#xff1a;sxjm 题目分析&#xff1…

4G,5G执法记录仪人脸识别、人脸比对使用说明

4G/5G执法记录仪或4G/5G智能安全帽&#xff0c;做前端人脸识别、人脸比对&#xff0c;采用了上市公司的成熟的人脸识别算法&#xff0c;需要支付LICENSE给算法公司&#xff0c;理论上前端设备支持30K的人脸库&#xff08;受设备运行内存限制&#xff09;。 4G/5G执法记录仪侧要…

【Spring源码分析】ResolvableType

【Spring源码分析】ResolvableType 参考 目录 文章目录 【Spring源码分析】ResolvableType一、ParameterizedType 参数化类型&#xff0c;即泛型&#xff1b;例如&#xff1a;List< T>、Map< K,V>等带有参数化的对象;二、GenericArrayType—— 泛型数组 泛型数组…

Flink container exit 143 问题排查

你好&#xff0c;我是 shengjk1&#xff0c;多年大厂经验&#xff0c;努力构建 通俗易懂的、好玩的编程语言教程。 欢迎关注&#xff01;你会有如下收益&#xff1a; 了解大厂经验拥有和大厂相匹配的技术等 希望看什么&#xff0c;评论或者私信告诉我&#xff01; 文章目录 一…

一站式PDF解决方案:如何部署自己的PDF全能工具(Docker部署和群晖部署教程)

文章目录 📖 介绍 📖🏡 演示环境 🏡📒 开始部署 📒📝 Docker部署📝 群晖部署📝 本地安装⚓️ 相关链接 ⚓️📖 介绍 📖 在数字化办公的今天,PDF文件几乎成了我们日常工作中不可或缺的一部分。但你是否曾因为PDF文件的编辑、转换、合并等问题而头疼?如果…

对称二叉树

给你一个二叉树的根节点 root &#xff0c; 检查它是否轴对称。 示例 1&#xff1a; 输入&#xff1a;root [1,2,2,3,4,4,3] 输出&#xff1a;true示例 2&#xff1a; 输入&#xff1a;root [1,2,2,null,3,null,3] 输出&#xff1a;falses 思路&#xff1a;我刚开始是想着用…

【35分钟掌握金融风控策略21】贷前额度策略

目录 贷前策略审批流程和统一额度管理 贷前策略审批流程 统一额度管理 预授信策略 贷前策略审批流程和统一额度管理 贷前包含了多个风控场景&#xff0c;这些风控场景的策略在执行时是否存在先后顺序呢&#xff1f;在贷前&#xff0c;除上述主要的风控场景&#xff0c;还有…

使用Selenium破解滑动验证码的原理及解决思路

1、获取页面元素信息&#xff1a; 使用Selenium打开目标网页&#xff0c;并通过相关方法获取滑块、背景图等元素的位置和属性信息。可以使用Selenium提供的定位方法&#xff08;如xpath、CSS选择器等&#xff09;来找到这些元素。 可以使用find_element_by_xpath或find_elemen…

基于STC12C5A60S2系列1T 8051单片机实现一主单片机给一从单片机发送数据的串口通信功能

基于STC12C5A60S2系列1T 8051单片机实现一主单片机给一从单片机发送数据的串口通信功能 STC12C5A60S2系列1T 8051单片机管脚图STC12C5A60S2系列1T 8051单片机串口通信介绍STC12C5A60S2系列1T 8051单片机串口通信的结构基于STC12C5A60S2系列1T 8051单片机串口通信的特殊功能寄存…

二叉树的非递归遍历(c++)

前序 . - 力扣&#xff08;LeetCode&#xff09;. - 备战技术面试&#xff1f;力扣提供海量技术面试资源&#xff0c;帮助你高效提升编程技能,轻松拿下世界 IT 名企 Dream Offer。https://leetcode.cn/problems/binary-tree-preorder-traversal/description/ 1---2---4---5--…

GEE数据集——高分辨率全球树冠高度地图(1 米)Meta 公司

高分辨率 1 米全球树冠高度地图 简介 全球树冠高度地图数据集提供了对全球树冠高度的全面了解,有助于对森林生态系统、碳固存和气候变化减缓工作进行精确监测。该数据集由 Meta 和世界资源研究所合作开发,是了解森林结构和动态的基石。通过融合最先进的卫星图像和先进的人工…

Go实现树莓派读取at24c02 eeprom读写数据

步骤 启用i2c 参考 Go实现树莓派读取bh1750光照强度 代码 package mainimport ("fmt""periph.io/x/conn/v3/i2c" )type AT24C02Device struct {dev *i2c.Dev }func NewAT24C02Device(addr uint16, bus i2c.BusCloser) (*AT24C02Device, error) {var (d…

千亿美元《人工智能》超级计算机!

微软与OpenAI的合作将引领人工智能领域的巨大飞跃。他们共同打造的百亿美元人工智能超级计算机项目将推动技术的边界&#xff0c;为未来科技发展开辟全新的可能性。这一合作不仅体现了科技巨头之间的紧密合作&#xff0c;也展现了人工智能在全球范围内的战略重要性。 微软和 O…

截图文字怎么识别?这里有三种识别方法

截图文字怎么识别&#xff1f;在数字化时代&#xff0c;信息的快速处理和转换成为了提高工作效率的关键。截图文字识别技术&#xff0c;作为连接视觉信息与数字文本的桥梁&#xff0c;极大地便利了我们的工作和生活。它允许用户从图像中提取文字内容&#xff0c;进而编辑、搜索…

luceda ipkiss教程 71:统计线路中器件的个数

**案例分享&#xff1a;**统计线路中某一器件的个数 如&#xff0c;统计SplitterTree中mmi的个数&#xff1a; 所有代码如下&#xff1a; # Copyright (C) 2020 Luceda Photonicsfrom si_fab import all as pdk from ipkiss3 import all as i3class GeneralizedSplitterTree…

第一步->手撕spring源码之Bean容器创建

什么是bean容器 可以存放数据的具体数据结构实现&#xff0c;都可以称之为容器。例如&#xff1a;ArrayList、LinkedList、HashSet等。bean就是对象的定义 spring中bean的多样性需要区分就需要用到键值索引的场景 故选择 HashMap。 什么是hashMap&#xff1f; HashMap 是一种基…

Java入门基础学习笔记15——强制类型转换

大范围类型的变量是否可以赋值给小范围类型的变量呢&#xff1f; IDEA直接报错。直接报错&#xff0c;是提醒你有问题。但是我非常进行类型转换。 非要强行赋值呢&#xff1f; 强制类型转换&#xff0c;强行将类型范围大的变量&#xff0c;数据赋值给类型范围小的变量。 数据…