Question

在下面的代码中selectTextOnly()通过点击onclick顶部的任何单元格或div来调用。

在Chrome中如果点击任何表格单元格，一切正常。但是，当我单击div时，函数会被调用，但不会设置任何选择。

单击div和单元格在Firefox中按预期工作。

为什么点击div不选择Chrome中的细胞？

上的示例

HTML

<div style="width: 45px; height:20px; background-color:#339900" onclick="selectTextOnly('notes')" id="test"></div>

<table id="all" class="optionEmail"  width="100%" border="0">
  <tr>
    <td id="notes" onclick="selectTextOnly('notes')">This is the notes cell</td>
  </tr>
  <td> 
  <table id="email">
  <tr>
    <td onclick="selectTextOnly('email')">This is the email cell</td>
  </tr>
  <tr>
    <td id="itinerary" onclick="selectTextOnly('itinerary')">This is the flights cell</td>
  </tr>
  <tr>
    <td onclick="selectTextOnly('all')">This is the all cell</td>
  </tr>
  </table>
  </td>
</table>

的javascript：

function selectTextOnly(containerid) {
    if (document.selection) {
        var range = document.body.createTextRange();
        range.moveToElementText(document.getElementById(containerid));
        range.select();
    } else if (window.getSelection) {
        var range = document.createRange();
        range.selectNode(document.getElementById(containerid));
        window.getSelection().addRange(range);
    }
}

Answer 1

尝试将代码更改为：

function selectTextOnly(containerid) {
    var text = document.getElementById(containerid);
    if (document.body.createTextRange) {
        var range = document.body.createTextRange();
        range.moveToElementText(text);
        range.select();
    } else {
        var selection = window.getSelection();
        var range = document.createRange();
        range.selectNodeContents(text);
        selection.removeAllRanges();
        selection.addRange(range);
    } 
}

if语句用于检查仅用于IE的document.body.createTextRange;所有其他浏览器的else。演示：http://jsfiddle.net/IrvinDominin/2K3ZT/2/

getSelection在Chrome中无法正常运行

1 个答案: