精华内容
下载资源
问答
  • 双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题IE及Chrome下的方法一样,对相应的元素添加onselectstart=”return ...

    在双击左右箭头,快速切换图片滚动时,会选择附近区域的文字,感觉不是很好,今天在同事在分享时,讲到了这个问题, 试了一下,不错,解决了问题

    IE及Chrome下的方法一样,对相应的元素添加onselectstart=”return false;”但是,这个在火狐下不起作用,但是火狐下可以用css样式来达到这个效果,即添加-moz-user-select:none;就可以兼容ie,google,firefox了,即代码如下所示:

    1

    屏蔽双击选中文字的区域

    这样这个区域的文字都不能选中了,就也不会出现在双击左右箭头快速切换图片滚动时会选择附近区域文字的情况了

    如果把

    1

    1

    2

    3

    4

    body

    {

    -moz-user-select: none;

    }

    添加到body中,就实现了禁止用户选中页面上内容的效果

    css禁止双击页面选中文本

    -ms-user-select 属性是一个新的级联样式表 (CSS) 属性,它使 Web 开发人员和应用开发人员能够控制用户在其网页或使用 JavaScript 的 Windows 应用商店应用中选择文本的位置。 本主题介绍如何在你自己的网页上实施 -ms-user-select 属性。(采用完全相同的方法在使用 JavaScript 的 Windows 应用商店应用中实施 -ms-user-select 属性。)它包含以下几部分:

    Note user-select 属性当前不是任何万维网联合会 (W3C) CSS 规范的一部分。该属性最初是在 CSS3 的用户界面模块中提出的,但是该模块已被不包含 user-select 属性的 CSS3 基本用户界面模块所取代。其他主要的浏览器支持带有其各自前缀的此属性版本。这三个实现之间存在细微区别,因此请确保在不同的浏览器中测试你的应用程序。

    简介

    在网页上选择文本的功能在许多用户方案中非常重要。请考虑一个典型的新闻站点。大多数页面包含新闻文章,由于用户希望共享内容而想要选择文章的内容。但是,页面还可能包含用户不需要或不希望选择的菜单、广告和指向站点其他部分的链接。Internet Explorer 10 中引入对新 -ms-user-select CSS 属性的支持以后,你可以指定允许在何处使用文本选择功能,例如在新闻文章的正文中允许使用,但在菜单中不允许使用。

    使用 -ms-user-select

    -ms-user-select 属性具有四个可能值:

    关键字

    Description

    element

    在指定的元素内启动选择时,文本是可选择的。但是,文本选择限制在该元素的边界内。

    none

    在指定的元素内启动选择时,文本不可选择。但是,在指定的元素之外启动的文本选择仍可输入元素。

    text

    在指定的元素内启动选择时,文本是可选择的。文本选择未限制在元素的边界内,并且可以越过其边界。

    auto

    这是初始值。如果元素包含可编辑文本,例如 input 元素或其 contenteditable 设置为 "true" 的元素,则该文本是可选择的。否则,选择由父节点的 -ms-user-select 属性的值确定。

    返回到我们的新闻站点方案,例如,你可以在整个页面上将 -ms-user-select 设置为 "none",然后在主文章上将 -ms-user-select 设置为 "element"。这样做,则只有文章文本是可选择的。希望选择新闻文章的内容的人们可能不希望选择刚刚过去的文章的页脚元素。因此,将 -ms-user-select 设置为 "element",这样使得这些用户可以只轻松选择文章的内容,但不必担心光标放置位置是否完全正确。对于通过触摸导航的用户,这一点尤其重要。

    你可以通过将 -ms-user-select 设置为 "none",在任何页面元素内关闭文本选择。用户将无法在指定的文本块内启动选择。但是,如果用户在页面的其他区域上启动文本选择,则可以在页面的任何区域内继续选择,其中包括将 -ms-user-select 设置为 "none" 的区域。

    示例实施

    IE Test Drive 具有正在使用的 -ms-user-select 属性的实例演示。该演示展示了一个博客帖子的实例模型,其中具有几个不同的文本内容区域:作为整体的博客 ("#blog"),由博客帖子 ("#blogPost") 和几条评论 (".comment") 组成。每个区域依次由不同类型的文本元素组成,其中包括 input 和 textarea 元素以及其 contenteditable 属性设置为 "true" 的元素。

    0818b9ca8b590ca3270a3433284dd417.png

    页面左侧的弹出菜单具有几个选项,这些选项用于设置页面元素上的 -ms-user-select。让我们简要地浏览一下演示内弹出菜单中列出的选项。

    正常选择

    此选项指示未在页面上的任何元素上设置 -ms-user-select。用户可自由选择任意所选元素中的文本。

    关闭除可编辑内容外的选择

    此选项将博客(作为整体)的 -ms-user-select 设置为 "none"。这意味着,不可选择除了可编辑区域内的文本之外的任何内容,例如“名称”和“评论”字段。

    CSS

    #blog {

    -ms-user-select:none;

    }

    在任何位置关闭选择

    此选项针对所有元素将 -ms-user-select 设置为 "none",这次将包含用户输入字段(input 和 textarea 元素),以及contenteditable 设置为 true 的其他所有元素。这意味着,不可选择任何内容,包括可编辑区域中的文本。

    CSS

    #blog, #blog input, #blog textarea, #blog *[contenteditable=true] {

    -ms-user-select:none;

    }

    仅选择博客帖子内容

    此选项针对其 ID 为 "blogPost" 的元素,将 -ms-user-select 设置为 "element",同时将博客作为整体,将 -ms-user-select 设置为 "none"。 这意味着,只能选择博客帖子文本。

    CSS

    #blogPost {

    -ms-user-select:element;

    }

    #blog {

    -ms-user-select:none;

    }

    仅选择评论

    此选项针对其类为 "comment" 的所有元素,将 -ms-user-select 设置为 "element",同时将博客作为整体,将 -ms-user-select 设置为 "none"。 这意味着,只能选择评论文本。

    CSS

    .comment {

    -ms-user-select:element;

    }

    #blog {

    -ms-user-select:none;

    }

    在博客帖子或评论中启动选择,但可以扩展

    此选项针对其 ID 为 "blogPost" 或其类为 "comment" 的所有元素,将 -ms-user-select 设置为 "text",同时将博客作为整体,将 -ms-user-select 设置为 "none"。这意味着,仅在博客帖子或评论中启动文本选择,但选择可扩展到任意这些区域之外。但是,文本选择无法在博客帖子或评论之外启动。

    CSS

    #blogPost, .comment {

    -ms-user-select:text;

    }

    #blog {

    -ms-user-select:none;

    }

    其他浏览器中的支持

    编写本文时,Mozilla 和 WebKit 均支持带有其各自前缀的 user-select 属性版本。但是,在其实施中存在某些不同之处。对于最新信息,请参阅以下任一链接:

    展开全文
  • 默认 默认鼠标双击选中,一个变量(若tableNameTypeName) 如想选中,一个变量的一个单词,则按Ctrl+Alt+S.,如下图,勾选即可

    默认

    默认鼠标双击选中,一个变量(若tableNameTypeName)
    如想选中,一个变量的一个单词,则按Ctrl+Alt+S.,如下图,勾选即可
    在这里插入图片描述

    展开全文
  • css文字禁止双击选中

    2021-10-05 21:19:29
    body{ -moz-user-select:none;/火狐/ -webkit-user-select:none;/webkit浏览器/ -ms-user-select:none;/IE10/ -khtml-user-select:none;/早期浏览器/ user-select:none; }

    body{
    -moz-user-select:none;/火狐/
    -webkit-user-select:none;/webkit浏览器/
    -ms-user-select:none;/IE10/
    -khtml-user-select:none;/早期浏览器/
    user-select:none;
    }

    展开全文
  • 本篇教程介绍了HTML+CSS入门 如何实现取消双击选中文字,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门。<在我们在写前端页面的时候,由于手速过快(当然这都是指的老司机),会经常双击,浏览器就会...

    本篇教程介绍了HTML+CSS入门 如何实现取消双击选中文字,希望阅读本篇文章以后大家有所收获,帮助大家HTML+CSS入门。

    <

    在我们在写前端页面的时候,由于手速过快(当然这都是指的老司机),会经常双击,浏览器就会默认选中你双击的文本,这种感觉有点不太好。

    这个时候就用到了  user-select:none; 属性。

    因为存在着兼容性的问题,所以在写的时候就需要考虑一下了。

    div{

    -moz-user-select:none;/*火狐*/

    -webkit-user-select:none;/*webkit浏览器*/

    -ms-user-select:none;/*IE10*/

    -khtml-user-select:none;/*早期浏览器*/

    user-select:none;

    }

    这样这个区域的文字就不会被选中了。

    还有种方法就是在相应的元素上添加  onselectstart="return false;"

    这又是一段文字

    这样也是可以实现不被选中的效果。

    如果把上述的方法写到body中,就实现了禁止用户选中页面上内容的效果。

    本文由职坐标整理发布,欢迎关注职坐标WEB前端HTML/CSS频道,获取更多HTML/CSS知识!

    展开全文
  • css取消双击选中文字

    千次阅读 2021-04-24 20:43:41
    如何让用户不能选中文字呢? 还有种方法就是在相应的元素上添加 onselectstart=“return false;” div{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10...
  • 新装的Android studio,有个小问题,就是选中单词的时候,鼠标双击只能选驼峰前的,看下效果 onBindView
  • 问题描述,在使用layui的laydate组件的时候,会用到时间日期选择器,但是官方的时间日期选择器并不支持双击操作,因此改造了一下 layui的代码 以实现时间选择器双击选中 (范围选择没有测试,如需用到laydate的时间...
  • 对于写php和js的人来说,sublime双击无法选中$xxx,只能...将word_separators里的删掉即可,这样就能双击选中删掉即可,这样就能双击选中删掉即可,这样就能双击选中及变量名了。 首选项-设置 删除这个 $ 即可。 ...
  • JS实现鼠标双击选中表格单元格代码-www.webdm.cn.STYLE3 {font-size: 13px; color: #FF0000; }.STYLE4 {font-size: 12px}商品名称数量价格合计源码爱好者1888888数码相机224004800手机424009600var lastSelection = ...
  • 复制一段文本后,双击选中另一段文本进行粘贴替换操作. 但在双击选中字符串的操作中,剪贴板上已经重新复制替换成了选中的这个字符串. 原因: 这是因为某些取词软件造成的 解决: 退出欧陆词典或者有道词典, 或者将...
  • 问题描述我们知道浏览器页面上的文字正常情况下我们是可以双击选中、或者单击鼠标横向拖动也能选中的,选中以后可以右击出现面板然后去复制什么的。但是有的时候,这种效果我们并不想要的,比如用户点快了的时候,...
  • js 双击选中文字时取消蓝色色块 只需要在css中设置 user-select属性为none即可 div{ user-select:none; -ms-user-select:none; // IE -moz-user-select:none; // 火狐 -khtml-user-select:none; // 早期浏览器 ...
  • css: 可用于所需页面样式不止局限于body body { -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*webkit浏览器*/ -ms-user-select: none; /*IE10*/ -khtml-user-select: none;...
  • js双击禁止选中文字

    2021-12-12 01:35:30
    window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();
  • File菜单 ----> settings----Editor -----> 找到 smart keys ----> 取消 驼峰 选项。不仅可以双击选中整个变量,还可以高亮显示打开的文件所有同名的变量。
  • <template> <footerclass="main-footer"> <h1>bbbbbbbbbbbbbbb</h1> <button@click="change">不显示</button> <div@click="dblclient"ref="fish">.../...
  • -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
  • // 监听双击事件 document.addEventListener("dblclick", doubleClick, true); // 监听释放鼠标按钮事件 document.addEventListener("doubleClick", mouseUp, true); // 双击处理函数 function doubleClick()...
  • figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { /*↓↓↓↓↓↓↓↓↓↓↓↓ 以下 这是禁止浏览器双击选中字体*/ -moz-user-select:none;...
  • 取消Vue双击显示编辑状态时的文字选中

    千次阅读 多人点赞 2021-06-04 15:46:50
    一般我用的状态切换是input中的disabled属性来实现只读的,但是当我们在从只读切换到编辑状态时,我们触发双击事件,但是双击事件他有默认行为(如我你的input中用value的话,他就会默认选中value,并让input失去焦点...
  • div,span{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:none;/*IE10*/ -khtml-user-select:none;/*早期浏览器*/ user-select:none; }
  • css加给任意需要的标签都行 span{ -moz-user-select:none; /*火狐浏览器*/ -webkit-user-select:none; /*webkit浏览器*/ -ms-user-select:none; /*ie浏览器*/ user-select:none; /*其他浏览器*/ ...
  • 为了方便编辑字幕,这里QGraphicsTextItem需要支持任意拖动,回车确认,鼠标双击进入编辑状态,右键弹出菜单(剪切、复制、删除、全选)等操作。 实现思路: 重写QGraphicsTextItem,重写鼠标事件、键盘事件,完成功能...
  • 当我单击它并且之前已选中时,我需要取消选择该选项.我尝试过一些东西,但它们不起作用,因为每次我点击选项它会被选中是否是这样它是不可能知道它是否以前被选中并且应该被取消选择或者它是我第一次点击它选择它...
  • //设置点击事件,双击单元格,弹出修改信息的窗口或者框 connect(ui->tableWidget,&QTableWidget::itemDoubleClicked,this,[=](){ ...//双击单元格选中一行 //设置选中整行 ui->tableWidget..
  • 双击页面时,会出现蓝色背景,选中文字,css 样式解决问题
  • 应该这样修改,即可双击单元格进入编辑状态,内容处于被选中状态, QVariant dataModel::data(const QModelIndex &index, int role) const { if (!index.isValid()) return QVariant(); if (role == Qt:...
  • JS双击禁止选中文字

    2021-11-17 15:22:29
    window.getSelection?window.getSelection().removeAllRanges():document.selection.empty();
  • 代码 window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 169,479
精华内容 67,791
关键字:

双击选中