当在pdf.js中的空格上拖动时，防止文本选择从“跳转”到顶部

Question

我正在使用带有文本选择的pdf.js。

因此，pdf.js创建了一组绝对定位的div，其中包含来自pdf的各种文本，以提供文本选择。

拖动以选择文本时，如果继续选择非文本区域(如段落之间的区域)，则选择会跳转到选择文本顶部的所有内容。

如果你去他们的例子，你可以看到我所描述的。试着在左栏的几个段落上选择文本，你会看到选择“闪烁”到选择顶部的所有内容。http://mozilla.github.io/pdf.js/web/viewer.html

有没有关于如何防止这种情况发生的想法？这非常让人分心。

我认为这与所有持有绝对文本的div有关。

Answer 1

修正:只需增加高度:200px

.textLayer > div {height:200px;}

在viewer.css中

Answer 2

这有点老了，但对某些人可能还是有用的。将textLayerMode设置为2应该可以解决这个问题。

示例：

new PDFViewer({ ...otherProps, textLayerMode: 2 })

Answer 3

在pdf.js文件中，搜索function appendText并添加

textDiv.className = "hitext";

下面

var textDiv = document.createElement('div');

现在将此代码添加到您的自定义js文件中：

window.addEventListener('mousedown', function mouseup(evt) {

if($(".hitext:hover").length==0) //To check if the cursor is hovering over the text
{
  //Selection is disabled using CSS if the mousedown event was triggered when the cursor was not over the text
  $(".hitext").css({"-webkit-touch-callout": "none", "-webkit-user-select": "none", "-khtml-user-select": "none", "-moz-user-select": "none", "-ms-user-select": "none", "user-select": "none"}); 
}
else 
{
  $(".hitext").css({"-webkit-touch-callout": "text", "-webkit-user-select": "text", "-khtml-user-select": "text", "-moz-user-select": "text", "-ms-user-select": "text", "user-select": "text"}); 
}

});