2

在我的网络应用程序中，我有一个包含显示文本的静态 HTML 内容的图层。

当我在页面上进行搜索 (ctrl+F) 并键入一些包含在上述图层中的文本时，文本会突出显示。

是否有可能使内容根本不对搜索做出反应？

或者，如果可以的话，我会从我的应用打开的页面中删除搜索功能。

4

7 回答 7

9

这很棘手，但您可以将图层的文本编写为content图层伪元素的 CSS 属性。通过这种方式，搜索功能无法检测到文本，并且无法突出显示文本本身。

例如

html

<div id="layer" data-text="this text won't be found"></div>

CSS

#layer:before {
   content: attr(data-text); 
}

图像解决方案也很好，但这需要额外的请求，并且使用默认浏览器功能无法在任何地方缩放文本。应避免使用其他需要 Flash（或 Silverlight 或 Java Applets）的解决方案，尤其是由于某些平台缺少播放器插件。

小提琴示例（使用 CSS attr()）：http: //jsfiddle.net/EbTNd/

于 2013-07-31T08:27:41.873 回答
2

在搜索中不显示的唯一选择是制作图像或 Flash 等外部媒体。这是一个通用的浏览器功能 (Ctrl + F)，它显示该文本，如果它存在于屏幕上，将被突出显示。

于 2013-07-31T08:24:19.923 回答
1

您可以阻止在您的页面中进行搜索。它有些有限，但您可以检查它是否合适。

window.onkeydown = function(e){
  if(e.ctrlKey && e.keyCode == 'F'.charCodeAt(0)){
    e.preventDefault();
    // Comment out this last one...
    alert('Ctrl+F');
  }
}

见小提琴：http: //jsfiddle.net/ozrentk/g4wrd/

于 2013-07-31T08:25:55.970 回答
1

一种解决方法是使用 CSS 内容声明在页面上注入文本。 在此处查看类似问题的答案

于 2013-07-31T08:30:16.003 回答
1

如果您只想使突出显示的文本与周围文本的颜色相同，则可以在许多浏览器中更改突出显示颜色。假设普通文本是白底黑字，

::-moz-selection {
  background: white;
  color: black;
}
::-webkit-selection {
  background: white;
  color: black;
}​
::selection {
  background: white;
  color: black;
}

将隐藏突出显示，同时保持正常的选择功能。

另请参阅使用 CSS 更改文本选择颜色？

于 2013-07-31T08:33:25.173 回答
1

尝试使用 SVG 渲染文本：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
  <text x="0" y="15" fill="red">I love SVG</text>
</svg>

http://www.w3schools.com/svg/svg_text.asp

编辑：在进一步探索之后，似乎为了防止搜索，您必须将 SVG 放在单独的文件中：

<object height="30" width="500" data="text1.svg" type="image/svg+xml">
  <embed src="text1.svg" type="image/svg+xml">
</object>
于 2013-07-31T08:35:41.427 回答
0

禁用-CTRL-F-jQuery-plugin

如何使用：

包括 jQuery 和 disableFind.js。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="disableFind.js"></script>

disableFind()在要使其不可搜索的元素上调用该函数。

$('p').disableFind();               // make all paragraphs unsearchable

$('.unsearchable').disableFind();   // make all elements with "unsearchable" class unsearchable

$(body).disableFind();              // make all text on page unsearchable
于 2013-07-31T08:53:11.163 回答