Question

如果文本输入标记放在锚点内，那么在Firefox（在Windows上）中无法操作文本框内的文本 - 文本光标不会改变其位置，也无法选择文本。在Chrome中，您可以更改光标位置，但不能选择文本。

在某些情况下，我们可以将父级设置为除锚之外的其他内容，但是有一种方法可以避免这种行为吗？

这是HTML代码：

<p>No text select in FF:</p>
<a href="#">
   <input type="text" value="7777" />
</a>

<p>Working text select in FF:</p>
<span>
   <input type="text" value="8888" />
</span>

fiddle。

Answer 1

您可以在聚焦输入元素时删除href属性。只要没有href属性，您就可以在输入字段中选择文本（在safari，chrome和firefox中测试）。

<a href="http://www.google.de" id="link">
  link
  <input type="text" id="input">
</a>

(function () {
  var link = document.getElementById('link');
  var input = document.getElementById('input');

  var saveHref = null;

  input.addEventListener('focusin', function () {
      savedHref = link.href;
      link.removeAttribute('href');
  });

  input.addEventListener('focusout', function () {
      link.href = savedHref;
      savedHref = null;
  });

})();

工作示例： http://codepen.io/jjd/pen/JYwLVr

Answer 2

因为浏览器中的实现错误。

实际上，当我们点击浏览器时，它会查找对象的类型通过这种方式 1.这是一个链接 2.这是任何其他类型（输入区域，图像，

为什么它首先检查“link”类型

 because clickig is firstly implemented for opening links,   
 anf its main usage is for open links

首先将其检测为链接，然后调用

。 openlink（示例）函数

Firefox中锚点内的输入框中没有文本选择

2 个答案: