`
wuzijingaip
  • 浏览: 330288 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js 拖拽时避免文字被选中

IEFirefoxOpera 
阅读更多 
<html>
<title>alixixi.com</title>
<head>
<script type="text/javascript">

function disableSelection(target){
if (typeof target.onselectstart!="undefined") //IE route
	target.onselectstart=function(){return false}
else if (typeof target.style.MozUserSelect!="undefined") //Firefox route
	target.style.MozUserSelect="none"
else //All other route (ie: Opera)
	target.onmousedown=function(){return false}
target.style.cursor = "default"
}

//Sample usages
//disableSelection(document.body) //Disable text selection on entire body
//disableSelection(document.getElementById("mydiv")) //Disable text selection on element with id="mydiv"

</script>
</head>

<body>
<div id="test" style="background:#f1f1f1;border:1px #000  dotted">这里不能选择</div>
<script type="text/javascript">
var somediv=document.getElementById("test")
disableSelection(somediv) //disable text selection within DIV with id="mydiv"
</script>
</body>
</html>
<a href="http://www.6tianf.com">欢迎访问六天赋网页制作自学基地</a>
分享到：
| Google导航菜单背景切换效果 javascript
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    鼠标移动div时禁止选中div中的文字的方法

    首先，我们可以使用CSS样式来禁止文字选中。一种通用的跨浏览器的解决方案是使用`user-select`属性。这个属性允许我们控制元素及其子元素是否可被用户选中。在CSS中添加以下样式： ```css html, body { -moz-user-...

    JavaScript模仿鼠标拖动选择功能

    这个功能可以让用户通过鼠标拖动来选取一个矩形区域内的元素，比如在文本编辑器中选择文字，或者在图像编辑工具中选取部分图像。下面将详细解释如何实现这一功能。 首先，我们需要监听鼠标的`mousedown`、`...

    基于原生JavaScript拖拽效果的实现.pdf

    （1）首先获取要进行拖拽的物体对象oD，拖动oD物体时按下鼠标后触发onmousedown事件，当拖动物体时会出现选中网页中文字的现象，这里需要用return false来阻止事件的默认行为。 ```javascript oD.onmousedown=...

    jq实现拖拽，可以选择显示的内容

    首先，选中需要拖动的元素，例如一个`&lt;div&gt;`： ```html 拖动我 ``` 然后，使用jQuery的`mousedown`、`mousemove`和`mouseup`事件来实现拖放行为： ```javascript $(document).ready(function() { var ...

    非常简单的网页拖拽效果js代码

    4. **阻止默认行为**：为了避免拖拽时选中文字或触发其他默认行为，可能需要调用`event.preventDefault()`。 5. **结束拖拽**：在`mouseup`事件中，停止对`mousemove`事件的监听，拖拽操作结束。 在提供的`index....

    bootstrap模态框实现拖拽效果

    4. **防止文字选中和模态框越界**： - 为防止拖动时背景文字被选中，可以应用CSS样式`user-select: none`到模态框上，以禁用文本选择。对于不同浏览器的兼容性，可以使用浏览器前缀，如`-webkit-user-select`, `-...

    js实现单元格拖拽效果

    返回`false`防止文字被选中跟随拖动。 - `onmouseup`事件监听鼠标释放，此时需要判断拖动后的单元格位置，并找到相邻单元格中距离最近的一个，更新拖动单元格的新位置。 6. **计算相邻单元格的距离**： 在鼠标抬...

    程序天下:JavaScript实例自学手册

    19.16 防止JavaScript文件被其他站直接引用 19.17 检查机器是否安装Word 19.18 打印当前页 19.19 打印预览 19.20 隐藏不想打印的页面内容 19.21 使用ExecWB直接打印 19.22 动态绑定XML文件 19.23 Kill Excel的进程 ...

    仿Google自定义拖拽层

    5. **取消选择**：为了避免拖动过程中选中文字等意外情况，可以使用`document.body.classList.add('nosel')`和`document.body.classList.remove('nosel')`来临时禁用文本选择。 6. **浏览器兼容性**：不同的浏览器...

    《程序天下：JavaScript实例自学手册》光盘源码

    19.16 防止JavaScript文件被其他站直接引用 19.17 检查机器是否安装Word 19.18 打印当前页 19.19 打印预览 19.20 隐藏不想打印的页面内容 19.21 使用ExecWB直接打印 19.22 动态绑定XML文件 19.23 Kill Excel的进程 ...

    兼容ＩＥ与火狐的拖动div效果

    - 在实际应用中，可能需要阻止默认的文本选择和拖放行为，避免在拖动过程中选中文字。 - 如果拖放的元素需要改变大小或形状，还需要处理相应的事件和计算。 通过以上步骤，我们可以创建一个兼容IE和Firefox的拖动...

    安卓Android源码——BTAndroidWebViewSelection（webview选择文字）.rar

    在使用`addJavascriptInterface`时，需要注意避免JavaScript代码注入的安全问题。必须确保所有暴露给JavaScript的接口方法都是安全的，防止恶意代码对Android应用造成危害。 ### 8. 性能优化 由于自定义文本选择...

    网页防复制代码

    网页防复制代码是一种技术手段，用于保护网站内容不被用户轻易地复制粘贴，从而减少内容被盗用的风险。在互联网上，很多网站拥有独特且有...在实施这些代码时，也应考虑到用户体验，避免对正常浏览造成不必要的影响。

    javaScript表单验证

    JavaScript 表单验证是前端开发中的一个常见需求，它能够帮助开发者在用户提交表单前进行数据校验，从而避免不必要的服务器请求并提升用户体验。本文将详细介绍几种常见的JavaScript表单验证方法，包括但不限于长度...

    react-sortable:使用react实现的简单的可拖拽排序的列表

    - **拖拽排序**：用户可以通过鼠标或触摸设备直接拖动列表项，改变它们在列表中的位置。 - **实时反馈**：在拖动过程中，元素会有一个视觉上的指示，显示当前拖动状态和可能的新位置。 - **事件监听**：提供了丰富的...

    如何复制我发复制的网页.pdf

    接着，将选中的文本拖拽到Word文档中即可。 了解不能复制的原因： 网页开发者使用特定的HTML属性，如`onpaste="return false"`、`oncopy="return false;"`、`oncut="return false;"`和`onselectstart = "return ...

    javascript小技巧,含有多种特效，实用功能

    - **`**: 禁止选中文本和拖动。这对于保护页面内容特别有用。 以上就是根据提供的文件内容整理的一些JavaScript小技巧，这些技巧覆盖了事件处理、DOM操作、表单与链接操作、特殊字符处理等多个方面，希望对大家有所...

    网页各个属性的功能作用

    - **功能**：此事件会在元素失去焦点时被触发。 - **应用场景**：常用于表单验证，例如当用户离开输入框后自动检查其内容是否合法。 #### 2. `onchange` - **功能**：当元素的状态发生变化时（如表单字段值改变），...

    超实用的jQuery代码段

    6.18 拖动表格时自动选中复选框 6.19 拖动表格行并放置到目标位置 6.20 表格的拖动排序 6.21 拖动调整控件的大小 6.22 调整控件大小时设置调整约束 6.23 使用拖动的方式调整表格的宽度 6.24 设计可改变单元格宽度并...

Magicbox
Global site tag (gtag.js) - Google Analytics