2021-11-04控制页面中的元素，双击不被选中

最新推荐文章于 2024-05-21 19:09:41 发布
最新推荐文章于 2024-05-21 19:09:41 发布
阅读量98 收藏
点赞数
文章标签： javascript 开发语言 ecmascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45188171/article/details/121143538
版权

给页面上的元素绑定单机事件，在双击的时候总会选中文字，感觉这样用户体验很不好，如何设置在双击时不被选中？

onselectstart="return false;"  //使用事件绑定的形式阻止事件触发，可以很好得解决这个问题。

##考虑到兼容性的问题 还可以使用css 属性

-moz-user-select:none // 如果有兼容性问题的话可以考虑使用这个方法
腥臭腐朽的日子熠熠生辉
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
计算机应用基础-实训项目二Word综合应用.doc
06-04
实训项目二 Word 综合应用示例 实训项目二 Word 综合应用 实训满分 20 分。 以日常应用为基础，设计一个综合运用 Word 基本操作技能解决实际问题的文档。文 档内容要求包括以下基本操作和元素： 标题、正文、页眉 /页脚/页码、首行缩进、分栏、边框和底纹、图片水印、表格及内容 （含表头斜线）、自选图形、艺术字、文本框、 SmartArt 图形、自定义页面等。 实训项目提交内容：（ 1）实训项目详细任务说明。（ 2）实训项目结果文档。 标题：打开 Word，在文档内输入想要的标题内容，点击上方"开始"，右侧可以设置 预设的标题格式。 正文：右键点击正文，选择修改，设置正文字体，然后就是修改段落格式，点格 式 -段 落，常见的段落设置有缩进设置，一般是首行缩进 2 字符，然后就是行距设置，设置完正文 格式的文字就统一修改完成。 页眉/页脚/页码：打开 Word 文档，页眉与页脚的添加。单击插入——页眉 /页脚，在内 嵌的格式选择一个并输入文字。页眉页脚的修改。双击工作区域，选中页眉 /页脚内容就可 以修改。单击设计——在右边选择关闭页眉页脚， 就可以关闭页眉页脚了。 页眉页脚的删除。 单击插入——选择页眉 /页脚——在最底部选择删除页眉 /页脚，就可以把页眉页脚删除。设 置完成单击保存就可以了。 首行缩进：首先把要设置首行缩进的段落选中。单击"开始"菜单选项卡，在工具 栏 中的单击"段落对话框"按钮，将会弹出段落对话框。在弹出的段落对话框中，在"缩进和 间距"选项卡中的" 缩进"组中有一个" 特殊格式 "参数， 默认情况下此参数的值为" 无"， 单击下拉列表，从下拉列表中选择"首行缩进"。选择了"首行缩进"后，在"磅值"处设 置缩进的字符数，把缩进字符数设置为" 2 字符"。单击确定按钮，则选中的段落中首行均 向内缩进了 2 个字符的效果。 分栏：选中需要分栏的内容 -> 点击 word 菜单中的【页面布局】 -> 点击页面设置选项卡 中的【分栏】 -> 在弹出的窗口中点击【两栏】即可 . 边框和底纹：打开需要添加边框和底纹的 Word 文档。选中准备添加边框和底纹的内 容，在"开始"选项卡中找到边框命令。在下拉菜单中选中相应的框线，被选中的框线就 会 被添加到选中内容。如果预设框线不满意的话，点选下拉菜单下的"边框和底纹"。在"边 框和底纹"对话框中选择满意的线条样式、颜色、宽度等，点击确定，设置好的线条就会 被 添加到正文中。 在对话框中选中底纹，设置好要添加的颜色。 点击确定后， 被选中的颜色就 会添加到正文中 . 图片水印：切换到"设计"选项卡下，在页面背景组中，单击"水印"按钮，这个时 候会弹出一个下拉列表，在弹出的下拉列表中选择"自定义水印"选项。弹出"水印"对话 实训项目二 Word 综合应用示例 1 实训项目二 Word 综合应用示例 框，从而选中文字水印按钮，在文字下拉列表中选择部门绝密选项，在字体下拉列表中 ，选 择黑体，字号和颜色自行设置即可，其他选项保持默认即可。返回到 word 文档中，就可以 看到设置的效果如何了。 表格及内容（含表头斜线）：新建一张需要插入斜线表头的表格。设置两个项目 的斜 线表头。选中左上角的单元格， 右键菜单点击单元格属性， 接着点击属性中的 "边框和底纹" ， 在弹出的"边框和底纹"对话框中选择单元格中插入斜线，确定。左上角单元格出线斜线 。 可以在分隔开的单元格中输入文字项目。 这是分两行输入文字项目的情况。 可以通过文字的 位置来使其显得更加美观一些。 自选图形： 光标定位在需要插入自选图形的位置。 点击"插入" --"形状" 。在"形状" 的下拉选项中， 我们点击选择自己需要的形状。 拖动鼠标插入需要的图形。 如果需要插入正 圆、正方形或者等边三角形，我们需要摁住 shift 键。单击图形，呈现选定状态，把鼠标放 到蓝色小点处， 我们可以拖拉鼠标改变图形的大小等。 鼠标移动到图形上方的点上， 光标变 旋转箭头， 拖动对图形进行旋转。在添加完成的图形上右击鼠标， 我们在弹出菜单选择 "设 置自选图形格式"。可以为图形改变线条颜色、粗细，添加填充效果等。 艺术字： 在顶部菜单栏中找到 "开始"，展开菜单，找到艺术字的选项按钮， 点击打开，在艺术字的设置界面当中， 我们可以选择自己喜欢的一种艺术字形式， 同时也可以设置文字的阴影和发光效果等。 文本框：在 Word 中插入文本框。插入 --文本框 --绘制文本框 SmartArt 图形：在选择需要插入现状位置之前的图形，单击"设计"选项卡的"创建 图形"组中的"添加形状"按钮，在弹出的下拉列表中选择"左下方添加形状"选项，之后 便可在选择图形的下方添加新的形状 自定义页面：打开 Word 文档，然后在文档中输入对应的内
计算机应用基础-实训项目二-Word-综合应用范文.doc
06-04
计算机应用基础课程是高职院校所有专业的一门公共必修课程。以下是分享的计算 机应用基础-实训项目二,Word,综合应用，希望能帮助到大家! 　　计算机应用基础-实训项目二,Word,综合应用 　　实训项目二 Word 综合应用 　　实训满分20分。 　　以日常应用为基础，设计一个综合运用 Word 基本操作技能解决实际问题的文档。文档内容要求包括以下基本操作和元素 　　标题、正文、页眉/页脚/页码、首行缩进、分栏、边框和底纹、图片水印、表格及 内容(含表头斜线)、自选图形、艺术字、文本框、SmartArt 图形、自定义页面等。 　　实训项目提交内容(1)实训项目详细任务说明。(2)实训项目结果文档。 　　标题打开Word，在文档内输入想要的标题内容，点击上方"开始"，右侧可以设置预 设的标题格式。 　　正文右键点击正文，选择修改，设置正文字体，然后就是修改段落格式，点格式- 段落，常见的段落设置有缩进设置，一般是首行缩进2字符，然后就是行距设置，设置完 正文格式的文字就统一修改完成。 　　页眉/页脚/页码打开Word文档，页眉与页脚的添加。单击插入——页眉/页脚，在内嵌 的格式选择一个并输入文字。页眉页脚的修改。双击工作区域，选中页眉/页脚内容就可 以修改。单击设计——在右边选择关闭页眉页脚，就可以关闭页眉页脚了。页眉页脚的删 除。单击插入——选择页眉/页脚——在最底部选择删除页眉/页脚，就可以把页眉页脚删除 。设置完成单击保存就可以了。 　　首行缩进首先把要设置首行缩进的段落选中。单击"开始"菜单选项卡，在工具栏中 的单击"段落对话框"按钮，将会弹出段落对话框。在弹出的段落对话框中，在"缩进和间 距"选项卡中的"缩进"组中有一个"特殊格式"参数，默认情况下此参数的值为"无"，单击 下拉列表，从下拉列表中选择"首行缩进"。选择了"首行缩进"后，在"磅值"处设置缩进 的字符数，把缩进字符数设置为"2字符"。单击确定按钮，则选中的段落中首行均向内缩 进了2个字符的效果。 　　分栏选中需要分栏的内容->点击word菜单中的【页面布局】- >点击页面设置选项卡中的【分栏】->在弹出的窗口中点击【两栏】即可. 　　边框和底纹打开需要添加边框和底纹的Word文档。选中准备添加边框和底纹的内容 ，在"开始"选项卡中找到边框命令。在下拉菜单中选中相应的框线，被选中的框线就会 被添加到选中内容。如果预设框线不满意的话，点选下拉菜单下的"边框和底纹"。在"边 框和底纹"对话框中选择满意的线条样式、颜色、宽度等，点击确定，设置好的线条就会 被添加到正文中。在对话框中选中底纹，设置好要添加的颜色。点击确定后，被选中的 颜色就会添加到正文中. 　　 ----------------------- 计算机应用基础-实训项目二-Word-综合应用范文全文共2页，当前为第1页。 计算机应用基础-实训项目二-Word-综合应用范文全文共2页，当前为第2页。
FairyDict-crx插件
03-18
包含几乎所有网上常见的词典，支持鼠标取词、键盘取词和右键菜单的词典软件，各种快捷键设置，学习的好帮手，词典爱好者的福音 FairyDict chrome 上的词典工具，注重用户体验，支持众多词典，学习英语的好帮手！ 支持鼠标悬停、或划线、或双击取词！ 支持快速查词，在鼠标附近显示词义！ 支持快捷键操作！ 支持右键菜单查询！ 同步保存历史记录! 目前已支持金山词霸、海词词典、Bible、必应词典, Urban Dictionary, dictionary.com，欧陆词典, Longman, Oxford, Cambridge, Merriam-webster, Collins, Macmilland 等等网络上几乎所有常见的词典，理论上可以支持所有在线词典。 小技巧： 点击 FairyDict 的图标可以关闭鼠标划词查询！ 进入设置里，可以设置各种快捷键，还可以设置鼠标取词时必须按住的快捷键哦！ ---------------- 3.1 版本更新 添加了沪江、人人、汉典、百度等词典，快速查词的显示位置可以设置了！ 3.0 版本更新 期待的鼠标悬停自动取词的功能来了！ 2.9 版本更新 新增音标和自动发音功能！ 2.8 版本更新内容 增强快速查词体验， 增加了一个设置项，点击图标可以打开查词典的窗口了。 2.7 版本更新内容 新增了快速查词功能，选中单词后在鼠标附近显示词义。可设置开关。 2.5版本更新内容 重新排好了Toolbar上的元素，布局更整洁了。 金山词霸替换成了网页版。 2.4版本更新内容: 添加大量常见的在线词典，包括欧陆词典, Longman, Oxford, Cambridge, Merriam-webster, Collins, Macmilland 等等。还增加了一个设置： 鼠标取词时可以选择必须按住一个按键(Ctrl, Shift, Alt 等)。 2.2 版更新内容： 新增必应词典, Urban Dictionary, dictionary.com 等深受喜爱的词典！！ 2.1 版更新内容： 可删除历史记录 2.0 版更新内容： 支持历史记录和单词分级功能； 更新设置页面，支持更多快捷键； 全面重构代码，修复一些bug； 1.1版更新内容： 加入了右键菜单支持 拍死了一些讨厌的臭虫 ---------------- TODO: 加入 Google、Bing 等提供的网络翻译功能； 支持更多词典； 保存生词本至云服务器； 支持卡片式记忆单词。 ---------------- 本软件已开源， 项目地址: https://github.com/revir/FairyDict 如果发现问题， 请提交 issue 到 github 或在 V2MM 上找我留言。 支持语言:中文 (简体)
JavaScript实用范例词典04-14
03-31
第4章 Cookie篇.... 96 4.1 将资料写入Cookie. 96 4.2 读取Cookie的值... 97 4.3 记录浏览者的姓名... 98 4.4 显示浏览次数... 99 4.5 记录浏览网站的时间... 101 4.6 只显示一次的弹出式窗口... 102 4.7 记住登录账号和密码... 103 4.8 检测浏览器是否关闭了Cookie 功能... 105 第5章 视窗篇.... 106 5.1 警告对话框... 106 5.2 在警告对话框上显示多行消息 正文... 106 5.3 确认对话框... 107 5.4 输入对话框... 108 5.5 显示网页对话框... 109 5.6 以顶层模式显示网页对话框... 110 5.7 取得浏览器窗口大小(Netscape) 110 5.8 取得浏览器窗口大小(IE) 111 5.9 设定浏览器窗口大小(IE) 112 5.10 不能改变大小的窗口... 113 5.11 指定浏览器窗口的位置... 114 5.12 取得屏幕的大小... 114 5.13 提示浏览者更改分辨率... 115 5.14 使浏览器窗口显示于屏幕中央... 116 5.15 使浏览器窗口显示于屏幕左上角... 117 5.16 使浏览器窗口显示于屏幕右下角... 118 5.17 使浏览器窗口大小适合于屏幕 大小... 119 5.18 窗口的从天而降效果... 120 5.19 振动的窗口... 122 5.20 窗口缩小效果... 123 5.21 窗口的自动向下滚动... 124 5.22 窗口的自动向右滚动... 125 5.23 双击鼠标滚动窗口/单击鼠标停止 滚动... 126 5.24 去掉窗口滚动条... 127 5.25 让滚动条在窗口左边出现... 128 5.26 改变窗口滚动条的样式... 129 5.27 不能最小化的窗口... 130 5.28 改变在浏览器地址栏中显示的 图标... 131 5.29 弹出一个新窗口... 131 5.30 弹出一个无属性栏的窗口... 132 5.31 弹出广告窗口... 133 5.32 弹出多个窗口... 134 5.33 指定弹出窗口的位置(IE) 135 5.34 指定弹出窗口的位置(Netscape) 136 5.35 弹出一个居中显示的窗口... 137 5.36 弹出一个全屏幕窗口... 138 5.37 在弹出的窗口中显示菜单... 139 5.38 在弹出的窗口中显示标准按钮栏... 140 5.39 在弹出的窗口中显示地址栏... 141 5.40 在弹出的窗口中显示状态栏... 141 5.41 在弹出的窗口中显示滑块... 142 5.42 允许调整弹出窗口的大小... 143 5.43 弹出一个顶层窗口... 144 5.44 关闭窗口... 145 5.45 在主窗口上关闭弹出式窗口... 146 5.46 在弹出式窗口上关闭主窗口... 146 5.47 将主窗口中的资料输出到弹出式 窗口中... 147 5.48 将弹出式窗口的资料输入到 主窗口中... 149 5.49 弹出一个自动关闭的窗口... 150 第6章 文字篇.... 152 6.1 连接字符串... 152 6.2 比较两个字符串... 153 6.3 取得字符串的长度... 154 6.4 英文字母大小写转换... 155 6.5 取得字符串中指定位置的字符... 156 6.6 取得指定Unicode值所表示的 字符... 157 6.7 搜索字符串... 158 6.8 从右至左搜索字符串... 159 6.9 撷取部分字符串... 160 6.10 将字符串分割成单个字符... 161 6.11 使用指定的字符分割字符串... 162 6.12 发光特效文字... 163 6.13 阴影特效文字... 164 6.14 半透明文字... 165 6.15 水波文字... 166 6.16 鼠标移上去后改变文字的颜色... 167 6.17 鼠标移上去后改变文字的样式... 168 6.18 让浏览者自己选择网页文字的 大小... 168 6.19 让浏览者自己选择网页文字的 颜色... 169 6.20 动态缩放文字... 170 6.21
前端学习-双击禁止选定文字
Zty_3184的博客
09-27 331
禁止双击选中文字使用window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
[css] 取消双击选中文字
qq_14993591的博客
04-02 427
div{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none; } 这样这个区域的文字就不会被选中了。 css取消双击选中文字 ...
css 设置页面中的元素双击不被选中
weixin_45188171的博客
05-17 535
// 此页面中的文字不被选中 -webkit-touch-callout: none; /*系统默认菜单被禁用*/ -webkit-user-select: none; /*webkit浏览器*/ -khtml-user-select: none; /*早期浏览器*/ -moz-user-select: none; /*火狐*/ -ms-user-select: none; /*IE10*/ user-select: none; 包含兼容性设置 ...
页面文字请使用css进行控制,css控制页面文字不能被选中user-select:none;
weixin_39818014的博客
08-04 83
CentOS 7 配置静态IP1.查看MAC地址 2.修改/etc/sysconfig/network-scripts/ifcfg-[第一步中红框内的文字] 3.添加和修改内容如下: 4.修改/etc/resolv.conf 5. ...(转)高性能JavaScript：加载和运行(动态加载JS代码)浏览器是如何加载JS的 当浏览器遇到一个标签时,浏览器首先根据标签src属性下载JavaScrip...
html禁止双击选中文本,CSS阻止页面双击选中文本
weixin_36145011的博客
06-09 1537
在双击左右箭头，快速切换图片滚动时，会选择附近区域的文字，感觉不是很好，今天在同事在分享时，讲到了这个问题， 试了一下，不错，解决了问题IE及Chrome下的方法一样，对相应的元素添加onselectstart=”return false;”但是，这个在火狐下不起作用，但是火狐下可以用css样式来达到这个效果，即添加-moz-user-select:none;就可以兼容ie，google，fire...
html实现选择项限选,利用CSS实现禁止双击选择页面内容的实例展示
weixin_36241447的博客
06-03 680
在双击左右箭头，快速切换图片滚动时，会选择附近区域的文字，感觉不是很好，今天在同事在分享时，讲到了这个问题， 试了一下，不错，解决了问题。IE及Chrome下的方法一样，对相应的元素添加onselectstart=”return false;”但是，这个在火狐下不起作用，但是火狐下可以用css样式来达到这个效果，即添加-moz-user-select:none;就可以兼容ie，google，fir...
自动复制「Auto Copy」-crx插件
03-20
为了使其与file：///网址一起使用，您必须在“Chrome扩展程序”页面上选中“允许访问文件网址”。内容脚本在扩展程序库中自动禁用。因此，该扩展程序无法在此页面或图库中的任何页面上运行，因此请在另一页面上进行...
html页面双击选中文字,css怎么设置双击不选中文字？
weixin_36342477的博客
06-03 1476
在双击左右箭头，快速切换图片滚动时，会经常双击，浏览器就会默认选中你双击的文本，这种感觉有点不太好。该如何取消双击选中文字呢？下面我们来看一下css设置双击不能选中文字的方法。css禁止双击页面选中文本可以使用user-select属性。css代码如下：div{-moz-user-select:none;/*火狐*/-webkit-user-select:none;/*webkit浏览器*/-ms...
openlayers绘制经纬网格，有添加或者移除功能
qq_52959651的博客
05-21 121
我的项目是vue写的，当点击多选框显示隐藏经纬网格，下面直接写代码。项目需要在地图中添加经纬网格，然后看了一下官网有相关的介绍。这是删除图层相关的网站。这是绘制经纬网格方法。
ant design DatePicker日期选择框指定分钟的间隔minuteStep属性
u010234868的专栏
05-17 200
在上面的例子中，DatePicker 将只允许用户以 15 分钟为间隔选择分钟。是 Ant Design 的 TimePicker时间选择框组件的一个属性。设置为 30，则用户可以选择以 30 分钟为间隔的分钟值。如果你想让分钟选项只能以 15 分钟为间隔选择，你可以将。
(Vue3+TS+Volar) 全局组件配置类型声明的最佳实践
从今年开始写写博客~~
05-14 245
简评：Volar官方全局组件的推荐写法，基于Volar，必须安装该插件，GlobalComponents是Volar专门为了解决全局组件类型而新增的类型接口。定义全局组件：使用GlobalComponents类型接口声明类型。
Vue.js的发展史（一）
2301_79683791的博客
05-15 760
Vue (发音为 /vjuː/，类似view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建，并提供了一套声明式的、组件化的编程模型，帮助你高效地开发用户界面。无论是简单还是复杂的界面，Vue 都可以胜任。来源官方解释-----简介 | Vue.js (vuejs.org)简单来说：Vue是一个属于JS的库，可直接引入一个JS文件就可以使用，与传统JS和JQuery框架不同，Vue的渐进式框架。
Vue3详细讲解
贫僧法号依平
05-15 857
Vue 3 介绍为什么要学习 vue 3Vue3 动机 和 新特性Vite 的使用vite介绍为什么选 Vite？Vite 的基本使用Vue3.0项目介绍vscode插件说明组合式API体验 composition APIsetup 函数reactive 函数ref 函数script setup语法(★)案例：显示鼠标案例计算属性computed函数侦听器watch函数钩子函数的使用组件通讯-父传子组件通讯-子传父依赖注入 - provide 和 inject模板中 ref 的使用vue3中废弃了过滤器。
echarts的柱状图使用
qq_45331969的博客
05-15 191
【代码】echarts的柱状图使用。
Vue从入门到实战Day07
最新发布
ltt159264的博客
05-21 601
目标：明确vuex是什么，应用场景，优势vuex是一个vue的状态管理工具，状态就是数据。大白话：vuex是一个插件，可以帮助我们管理vue通用的数据（多组件共享的数据）①某个状态在很多个组件来使用（个人信息）②多个组件共同维护一份数据（购物车）①共同维护一份数据，数据集中化管理；②响应式变化；③操作简洁（vuex提供了一些辅助函数）。
使用python如何操作Chrome浏览器, 写出具体步骤和代码,其中代码需要可复制, 要求包括可以访问页面, 单机或双击某一具体位置,在输入框中输入文字
04-21
首先，我们需要安装selenium模块和Chrome浏览器驱动程序。然后，以下是具体步骤和代码： ...上述代码可以访问目标页面、单机或双击某一具体位置，并在输入框中输入文字。注意，要根据实际情况修改元素的XPath路径。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值