禁止复制兼容input及各个版本浏览器

最新推荐文章于 2022-05-19 15:35:29 发布
最新推荐文章于 2022-05-19 15:35:29 发布
阅读量415 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 前端小tip 文章标签： input禁止复制 禁止复制兼容样式
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/yiyingcsdn/article/details/78531660
本文介绍了一种通过在HTML输入框中使用特定属性来禁用粘贴、复制、剪切等操作的方法，这对于保护敏感信息具有一定作用。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

页面元素中设置    

<input type="text"  onpaste="return false" oncontextmenu="return false" oncopy="return false" oncut="return false" >
 






 














                

        

    

    
  



    



                



	

		

			

				
					
大数据Hadoop实战篇

				
			

			

				

					需要远程指导仿真实验、代码有问题的，请后台私信或者关注公众号
				

				

					06-04
					
					8429
					
				

			

		

		

			
				
大数据Hadoop实战，10分钟带你入门Hadoop，手把手教你搭建分布式集群系统

			
		

	



                

            
              



	

		

			

				
					
CSS3---移动端苹果安卓适配

				
			

			

				

					weixin_45343884的博客
				

				

					09-20
					
					1870
					
				

			

		

		

			
				
常见苹果适配问题：
【问题1】：iPhone页面会自动把数字当成电话号码，点击后自动跳到电话拨号界面
♥♥♥方案：<meta name="format-detection" content="telephone=no" />
【问题2】微信浏览器自动调整页面字体大小
♥♥♥方案：禁止微信浏览器调整页面字体大小:
			body{
				-webkit-text-size-adjust...

			
		

	



              


  
              

                


	

		

			

				
					
网页防复制，禁止文字选中，禁止右键菜单js代码，兼容大部分浏览器方法

				
			

			

				

					泥猴桃的博客
				

				

					12-22
					
					698
					
				

			

		

		

			
				
css文件中放入如下代码:body {
-moz-user-select : none;
-webkit-user-select: none;
}js文件中放入如下代码：function iEsc() {
    return false;
}function iRec() {
    return true;
}function DisableKeys() {
    if(event.ctrlK

			
		

	





	

		

			

				
					
禁止浏览器默认复制文字/选中文字等

				
			

			

				

					零落依草木的博客
				

				

					01-06
					
					2078
					
				

			

		

		

			
				
本文介绍下，用jquery实现禁用右键，文本选择，以及复制按键的代码，有需要的朋友，参考下吧。









以下代码兼容IE、firefox、谷歌浏览器。
 

复制代码代码示例:


//禁用右键、文本选择功能、复制按键  
$(document).bind(“contextmenu”,function(){return false;});  
$(do

			
		

	



		

			
		



	

		

			

				
					
[html] input如何在各个浏览器下保持UI统一？

				
			

			

				

					歌谣的博客
				

				

					04-04
					
					194
					
				

			

		

		

			
				
[html] input如何在各个浏览器下保持UI统一？
.ibutton { padding: 3px 15px; *padding: 0 15px; *height: 24px; font-size: 12px; text-align: center; text-shadow: #CF510B 0 1px 0; border:1px solid #ec5c0d; border-radius: 2px; background: #FC750A; background-image: -webkit-line

			
		

	





	

		

			

				
					
2020-06-08 html的input在各浏览器下保持ui统一 + css的flex遇到nowrap布局影响 + js的promise + 弹性工作机制

				
			

			

				

					在下魔王ii的博客
				

				

					06-08
					
					423
					
				

			

		

		

			
				
# 2020-06-08 题目来源：http://www.h-camel.com/index.html
# [html] input如何在各个浏览器下保持UI统一？
进行初始化样式，例如：
.input-button {
padding: 3px 15px;
*padding: 0 15px;
*height: 24px;
font-size: 12px;
text-ali...

			
		

	





	

		

			

				
					
禁止文本框粘贴功能【支持IE、Mozlla、Firefox等】

				
			

			

				

					weixin_30242907的博客
				

				

					06-02
					
					95
					
				

			

		

		

			
				
<body>
<script type="text/javascript">
//not IE is required
function fncKeyStop(evt)
{
if(!window.event)
{
var keycode = evt.keyCode;
var key = String.fromCharCode(keycode).toLower...

			
		

	





	

		

			

				
					
不同浏览器兼容问题—— input 添加required属性 firefox下输入框为红色 +禁止中文输入

				
			

			

				

					jspshuishui的专栏
				

				

					05-17
					
					6501
					
				

			

		

		

			
				
1、如果一个表单控件具有required属性，在chrome浏览器下显示正常，在Firefox浏览器中会加上一圈粉红色的边框，无法实现各个浏览器统一，尤其是当你将这个控件设置了不显示某些边框线的时候，要去除Firefox给有required属性的表单控件添加的边框，只需要添加一句CSS代码即可。

添加下列代码以后，具有required属性的input和textarea将不再自动添加粉红色边框

			
		

	





	

		

			

				
					
前端面试题

				
			

			

				

					IT_Jiangxiaobai的博客
				

				

					05-19
					
					5595
					
				

			

		

		

			
				
01-HTML~02-CSS
1.每个HTML文件里面都有一个很重要的东西，Doctype，知道这是干什么的么？

要点一 : 该标签告知浏览器浏览文档要使用的HTML规范 , 告知浏览器以何种规范解析页面
要点二 : 声明对大小写不敏感

2.常用浏览器有哪些，内核都是什么？
答： 常用浏览器有chrome、safari、 IE、火狐(firefox) 、 Opera 、360、搜狗等




浏览器
内核
备注




IE
Trident
IE、猎豹安全、360极速浏览器、百度浏览器


firefo

			
		

	





	

		

			

				
					
【剪贴板功能实现深度剖析】：跨浏览器剪贴板操作的实战策略

				
			

			

				

					
				

			

		

		

			
				
![【剪贴板功能实现深度剖析】：跨浏览器剪贴板操作的实战策略]...首先介绍了剪贴板功能的基本概念和在不同浏览器中的兼容性问题，接着深入

			
		

	





	

		

			

				
					
【IE兼容性】background:transparent IE中Bug，不能选中input输入框，出现这个问题主要是IE8...

				
			

			

				

					weixin_33950035的博客
				

				

					04-30
					
					447
					
				

			

		

		

			
				


先解释下，background:transparent，默认在IE上会被解析成 background: none transparent scroll repeat 0% 0% 
transparent表示透明无颜色 
none 表示没有设置背景图片
repeat 表示图片反复
scroll 表示背景图片随浏览器下拉而滚动
0%水平位置在x0
0%垂直位置在y0



...

			
		

	





	

		

			

				
					
input禁止输入、复制、粘贴

				
			

			

				

					aGreetSmile的博客
				

				

					08-29
					
					932
					
				

			

		

		

			
				
element-ui el-input输入框

<el-input @paste.native.capture.prevent="handlePaste"></el-input>  禁止粘贴

<el-input>@copy.native.capture.prevent="handlePaste"></el-input>  禁止复制...

			
		

	





	

		

			

				
					
跨浏览器的剪贴板访问解决方案

				
			

			

				

					weixin_34062469的博客
				

				

					07-17
					
					257
					
				

			

		

		

			
				
在IE中，JS可以直接访问剪贴板，但是firefox,chrome等其它"高级"浏览器，就没这么幸运了。网上流传的所谓兼容firefox/IE的剪贴板访问javascript代码，都是N年前的往事了。
根据http://mozilla.com.cn/post/49413/ 上的说法:
----------------------------------
火狐不允许网页操作用户的剪切板，因为有...

			
		

	





	

		

			

				
					
input标签添加上disable属性在移动端字体颜色不兼容的解决办法。

				
			

			

				

					Leo的专栏
				

				

					05-10
					
					4756
					
				

			

		

		

			
				
就一段css样式。

			
		

	





	

		

			

				
					
JS怎么处理有些网页禁止选中复制方法过程详解

				
			

			

				

					这么多柠檬c
				

				

					09-28
					
					6731
					
				

			

		

		

			
				
有些网站会禁止用户复制或选中网页上的内容，有时候想复制下东西的确麻烦。无奈只能手动打出来么？当然不是！我们可以重新绑定事件，让选中和右键功能正常使用。

示例网址：https://yivian.com/news/50759.html



这个时候我们无法右键选中复制操作。



我们先在更多工具-》开发工具-》console 打开

复制以下js代码 回车键执行

document.onsele...

			
		

	





	

		

			

				
					
input标签在各浏览器下的兼容问题

				
			

			

				

					梦凝哲雪
				

				

					08-01
					
					1899
					
				

			

		

		

			
				
转载：http://www.jiangweishan.com/article/input-text-in.html
input输入框在各浏览器下的兼容问题比较普遍，也比较头疼，
例如在搜索输入框、表单里input输入框、选择按钮与文字混排等等，
现象：会出现高度以及不对齐的问题
今天就简单介绍下以及处理方法：
input标签在各浏览器里默认高度和宽度：
当input标签在type为text时，在F...

			
		

	





	

		

			

				
					
图片粘贴上传,预览——兼容ie（手动上传）和谷歌浏览器（粘贴或拖拽上传）(方法一)

				
			

			

				

					pearkerChen
				

				

					10-10
					
					2641
					
				

			

		

		

			
				
1.优化上传的css：


.img-class {
    width: 525px;
    height: 290px;
}

.img-paste-class {
    width: 530px;
    height: 330px;
}

.a-file {
    position: relative;
    display: inline-block;
    backgroun...

			
		

	





	

		

			

				
					
Vue 中银行卡号码禁止复制与粘贴

				
			

			

				

					seragxx的博客
				

				

					04-30
					
					732
					
				

			

		

		

			
				
input 中禁止粘贴：@paste.native.capture.prevent=""

input 中禁止复制：@copy.native.capture.prevent=""


			
		

	





	

		

			

				
					
跨浏览器兼容的input框提示文字实现方法

				
			

			

				

					
				

			

		

		

			
				
为了在input元素中实现跨浏览器的提示文字（placeholder）效果，特别是在IE 8及以下版本的浏览器上，我们需要采用一些JavaScript技巧以及其他兼容性解决方案。下面，我将详细阐述如何在不支持placeholder属性的...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

  
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值