javascript - ctrl 单击表格元素时删除默认蓝色边框

标签 javascript html css

<分区>

以前有人问过这个问题,但没有一个答案对我有用。

我尝试过的事情:

event.preventDefault() - 什么都不做。

从 css 中删除用户选择 - 不可行,用户应该仍然可以选择文本。

当 ctrl+click 时从事件中删除选择 - 有延迟,仅在 mouseup 后有效

上面的例子:

document.body.querySelector('tbody').addEventListener('click', e => {
    e.preventDefault();
  if (e.target.tagName === 'TD') {
    if(e.ctrlKey){
        //Select row logic here
        if (document.selection){
        document.selection.empty();
      }else if (window.getSelection){
        window.getSelection().removeAllRanges();
      }
    }
  }
})

http://jsfiddle.net/ppgab/zm1dgt3s/5/

当用户点击“之间”表格单元格时,这会变得格外烦人,然后它会选择所有单元格。

这个问题有什么优雅的解决方案吗?请不要使用 JQuery

最佳答案

我只是使用了错误的事件,mousedown 是正确的:

table.addEventListener('mousedown', e => {
    if(e.ctrlKey){
        e.preventDefault();
    }
})

关于javascript - ctrl 单击表格元素时删除默认蓝色边框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54441425/

相关文章:

javascript - 使用 ES6 和 webpack 导入 Angular 服务

javascript - 连接到我的 Visual Studio Online API 返回 HTTP 302

jquery - 向下滚动到单击的 DIV 不起作用

c# - 在 itextsharp 中将自定义字体应用于 html

css - Bootstrap 合理的导航不起作用

html - div 内的文本垂直和水平对齐

javascript - 在两个 HTML 注释行之间插入内容

javascript - 在 jQuery Mobile 中检测从边缘滑动

css - 如何让max-height在IE6,IE7中正常工作?

html - 使面板可滚动的困难