TESTED ON

Question

我有一个基于JQuery的 单页面Web应用程序，其中包含基于Knockout的丰富网格。

当我双击Knockout网格中的一行时，我会加载一个虚拟的数据页面，其中包含所选项目的详细信息，当我完成编辑（或者如果我取消）时，我会返回到网格。所有这些都发生在一个页面上。

如果我双击网格中的非文本区域，或者如果我将焦点设置为表单中的输入字段，则在重新显示网格时，一切都很有效。但是，如果我双击一行中的某些文本（如行项目的“名称”），然后立即单击“取消”返回到网格，则在重新显示时会选择所有网格的HTML。就像我点击并拖动网格来选择一个巨大的文本区域一样。

我一直在尝试以编程方式取消选择此选定的文字，但无济于事。我尝试了各种组合：

$(document).focus();
$("#idBody").focus();
$("#idBody").trigger("click");

如果我点击网格外的区域，我会得到我想要的行为。我有什么选择？

Answer 1

双击时的问题是，通过执行该操作，浏览器默认选择光标下的文本，创建一系列选定的文本。

工作Fiddle Example！

通过删除所选文字范围，我在过去解决了同样的问题：

if (window.getSelection) {
  if (window.getSelection().empty) {  // Chrome
    window.getSelection().empty();
  } else if (window.getSelection().removeAllRanges) {  // Firefox
    window.getSelection().removeAllRanges();
  }
} else if (document.selection) {  // IE?
  document.selection.empty();
}

您可以阅读：

window.getSelection at MDN和DOM Selection at MDN

removeAllRanges method at MSDN和HTMLSelection object at MSDN

此解决方案可归功于this answer和Mr. Y.。

TESTED ON

Windows XPProfissionalversão2002Service Pack 3

Internet Explorer 8.0.6001.18702
Opera 11.62
Firefox 3.6.16
Safari 5.1.2
Google Chrome 18.0.1025.168 m
K-Meleon 1.5.4

Windows 7 Home Edition Service Pack 1

Internet Explorer 9.0.8112.164211C
Opera 11.62
Firefox 12.0
Safari 5.1.4
Google Chrome 18.0.1025.168 m

Linux Ubuntu 12.04

Firefox 12.0
Chromium 18.0.1025.151（Developer Build 130497 Linux）

如何使用JQuery在网格中取消选择选定的HTML

1 个答案:

TESTED ON