Question

我需要更改Chrome状态栏中显示的文字。由于不再使用status.text（出于安全原因），我将<a>标记包裹在<body>上，因此我的代码为<a href="text that I manipulate" onclick="return false;"><body>...</body></a>。

按预期工作原因是每次用户在页面内移动鼠标时，状态栏都会准确显示<a>的href attr内部的内容。问题：到目前为止，我没有意识到我无法在页面内选择任何文本，因为它被视为链接。我正在使用return false onclick事件，它很有效，因为用户永远不会被重定向，但是不可能在<a>内选择文本。

是否有CSS属性允许我更改该行为？它仅在<a>标记时出现。

Answer 1

您可以尝试使用CSS属性pointer-events。

a{pointer-events:none}会禁用该元素的鼠标事件。

但更好的方法是在数据属性和点击事件中添加网址，您可以使用 location.href 导航到这些网址。

<a href="#" data-url="www.x.com"></a>

这会有帮助吗？

Answer 2

为了黑客的利益。这是无效的标记和错误的代码，但作为概念证明（至少对于Chrome）。

可以使用鼠标事件的各种组合，范围选择和可编辑。棘手的部分是计算选择的内容和位置。

示例代码应该让您选择段落中的第一个单词;如：在“Lorem ipsum”或“Duis posuere”中点击每个段落的开头，选择一些单词。然后，可以将其与mousedown，mousemove，mosueup等结合使用，以选择正确的文字。

Chrome only Fiddle

Answer 3

好的，只是为了好玩，这不是真正的黑客，但它有点接近：

这样做：

<body>
<div class=container>bla bla bla</div>
<a href="my custom text" id=the_hack></a>
</body>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
<script>
$(".container").hover(function(e){
$("#the_hack").trigger("focus");
});
</script>

当然它会有一些限制，当你选择文本状态栏会消失时，如果你突出显示文本将鼠标移出div而不是后退，选择将会丢失，但是嘿，这是一个黑客。

请参阅here我的意思。

链接标记<a> able to select text</a>

3 个答案: