禁用页面的鼠标选中拖动的事件，就是不运行执行选中操作

最新推荐文章于 2022-01-18 09:14:00 发布
最新推荐文章于 2022-01-18 09:14:00 发布
阅读量199 收藏
点赞数
文章标签： javascript ViewUI
原文链接：http://www.cnblogs.com/linyusong/p/6406346.html
版权 
//禁用页面的鼠标选中拖动的事件，就是不运行执行选中操作
//类似如下：
var bodyStyle = document.body.style; 
bodyStyle.mozUserSelect = 'none'; 
bodyStyle.webkitUserSelect = 'none';

 

转载于:https://www.cnblogs.com/linyusong/p/6406346.html

weixin_34321977
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Qt 之 简单截图功能（三）实现可拖拽选中区域
01-22
一个简单的小例子来看一看如何用Qt实现类似QQ的截图功能，详情见博客 ：http://blog.csdn.net/GoForwardToStep/article/details/54385140
通过CSS禁用页面内容选中和复制操作
09-25
在网页开发过程中，有时候需要防止用户选取页面上的文字，或者阻止用户通过鼠标拖动来复制页面内容。这通常是为了防止内容被轻易地复制，保护版权或者避免在文本编辑时误操作。CSS提供了一种简单的方法来实现这一...
屏蔽鼠标右键、选择、拖拽等事件
fighting_12的专栏
04-10 537
oncontextmenu="return false" ondragstart="return false" onselectstart="return false" ondrop="return false"
鼠标禁用左右键和鼠标拖动选取
iteye_20932的博客
11-20 307
  <body oncontextmenu="return false;" leftMargin="0" topMargin="0" oncopy="return false;" oncut="return false;" onselectstart="return false">   下面这些属性都需要加载在body标签里面 禁用鼠标右键： onc
Electron的使用笔记之禁用拖拽事件
weixin_45740906的博客
01-18 1638
Electron软件安装后如果用户拖拽文件或者图片到软件里面，会打开此文件，但是不能够关闭，因此导致体验不佳。 因此可以禁用全局的拖拽事件来阻止这个行为。 一、在util文件夹里面新建一个文件。 export default { mounted() { this.disableDragEvent(); }, methods: { disableDragEvent() { // 当拖动的元素或选择文本输入有效的放置目标时，会触发此事件。 window.add
vue实现页面内容禁止选中功能,仅输入框和文本域可选
12-13
/*系统默认菜单被禁用*/ -webkit-user-select:none; /*webkit浏览器*/ -khtml-user-select:none; /*早期浏览器*/ -moz-user-select:none;/*火狐*/ -ms-user-select:none; /*IE10*/ user-select:none; } input{...
js鼠标移动时禁止选中文字
01-19
这是通过CSS样式来实现的禁止用鼠标选择功能： unselectable为IE准备 onselectstart为Chrome、Safari准备 -moz-user-select是FF的 css style:html,body{-moz-user-select: none; -khtml-user-select: none; user-...
网页禁用右键菜单和鼠标拖动选择方法小结
09-03
在网页设计中，有时为了保护内容不被轻易复制或防止用户通过右键菜单触发特定功能，开发者可能会选择禁用鼠标右键菜单和鼠标拖动选择。这篇文章总结了两种禁用这些功能的方法，主要针对JavaScript技术。 一、禁止...
Pycharm代码无法复制,无法选中删除,无法编辑的解决方法
09-20
例如，在某些情况下，可能会无意间切换到列选中模式（Column Selection），这种模式下，用户无法通过简单的鼠标点击来选中代码，而必须使用特定的键盘组合来改变选中模式。此外，类似VimEmulator插件的干扰同样可能...
鼠标拖拽，阻止默认事件、事件冒泡。
qq_38384536的博客
06-27 3687
无标题文档 *{ margin:0; top:0} #box{ height:200px; width:200px; background:red; position:absolute; cursor:move} window.onload=function(){ var oDiv=document.getElementById('box'); var oInput=
页面禁止鼠标拖动 选择
送我一块糖的博客
01-18 1940
body class="easyui-layout" onselectstart="return false;">
html 鼠标mouseover信息提示事件
12-20 5921
一、使用背景：html页面中当鼠标指针位于元素上方时，弹出提示信息； 二、添加弹出信息样式： <style>  .pop-box {         z-index: 9999999999999999; /*这个数值要足够大，才能够显示在最上层*/         margin-bottom: 2px;         display: none;         positio...
禁止鼠标多次点击选中div中的文字
xiliuhu的专栏
10-18 2132
来源：http://www.cnblogs.com/myjiejie/archive/2010/12/04/1896327.html 今天遇到一个很少有的问题  做div的点击计数事件  因为里面有文字 所以 当点击多次时  文字老被选中  可郁闷了   查了查资料
layui的layer iframe禁止缩放拖拽
热门推荐
heerey525
07-04 1万+
弹层组件文档 - layui.layerlayer 至今仍作为 layui 的代表作，她的受众广泛并非偶然，而是这数年来的坚持、不弃的执念，将那些不屑的眼光转化为应得的尊重，不断完善和维护、不断建设和提升社区服务，在 Web 开发者的圈子里口口相传，乃至于成为今天的 layui 最强劲的源动力。目前，layer已成为国内最多人使用的 Web 弹层组件，GitHub 自然Stars5000+，官网累...
json存储latex代码,横坐标，纵坐标；网页读取json在网页通过json读取横坐标，纵坐标位置渲染latex，渲染的latex放在<div>中，<div>可以选中，按下鼠标移动鼠标可以拖动<div>,为了拖动顺滑，渲染出来的latex代码不能选中
最新发布
07-13
您可以使用JSON存储Latex代码、横坐标和纵坐标的数据。然后，您可以使用网页中的JavaScript代码读取该JSON数据，并将横坐标和纵坐标位置上的Latex代码渲染到指定的<div>元素中。 为了实现拖动<div>元素的功能，您可以使用一些JavaScript库，例如jQuery UI 或者 interact.js。这些库都提供了拖动和选中元素的功能。您可以在<div>元素上应用相应的拖动和选中功能，以使其能够被拖动但不能被选中。 以下是一个简单的示例代码，演示了如何使用JSON数据渲染Latex代码，并应用拖动和选中功能： ```html <!DOCTYPE html> <html> <head> <title>Latex渲染与拖动示例</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/ui/1.13.0/jquery-ui.min.js"></script> <script> $(document).ready(function() { // 读取JSON数据 $.getJSON("data.json", function(data) { // 获取横坐标和纵坐标数据 var x = data.x; var y = data.y; // 将Latex代码渲染到<div>中 $("#latex-container").html("\\(" + x + ", " + y + "\\)"); // 应用拖动功能 $("#latex-container").draggable(); // 禁用选中功能 $("#latex-container").on("selectstart", function() { return false; }); }); }); </script> <style> /* 设置<div>的样式 */ #latex-container { position: absolute; top: 100px; left: 100px; cursor: move; user-select: none; } </style> </head> <body> <div id="latex-container"></div> </body> </html> ``` 在上述示例中，您需要将Latex代码、横坐标和纵坐标数据存储在名为"data.json"的JSON文件中。然后，使用jQuery的getJSON函数读取该文件，并将数据渲染到指定的<div>元素中。接下来，使用jQuery UI的draggable函数使<div>元素具有拖动功能。最后，通过禁用选中功能，防止<div>元素中的内容被选中。 请注意，此示例仅演示了基本的实现方法，您可能需要根据您的具体需求进行相应的调整。此外，还可以根据需要使用其他JavaScript库或框架来实现类似的功能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值