选择和iPhone/iPad的网络浏览器Safari浏览器不工作

可能的复制文本的高亮：Change CSS of selected text using Javascript 选择和iPhone/iPad的网络浏览器Safari浏览器不工作

我试图将代码从上面的链接，但没有得到iPad的浏览器以高亮显示所选文本的结果。

function makeEditableAndHighlight(colour) { 
    var range, sel = window.getSelection(); 
    if (sel.rangeCount && sel.getRangeAt) { 
     range = sel.getRangeAt(0); 
    } 
    document.designMode = "on"; 
    if (range) { 
     sel.removeAllRanges(); 
     sel.addRange(range); 
    } 
    // Use HiliteColor since some browsers apply BackColor to the whole block 
    if (!document.execCommand("HiliteColor", false, colour)) { 
     document.execCommand("BackColor", false, colour); 
    } 
    document.designMode = "off"; 
} 

function highlight(colour) { 
    var range, sel; 
    if (window.getSelection) { 
     // IE9 and non-IE 
     try { 
      if (!document.execCommand("BackColor", false, colour)) { 
       makeEditableAndHighlight(colour); 
      } 
     } catch (ex) { 
      makeEditableAndHighlight(colour) 
     } 
    } else if (document.selection && document.selection.createRange) { 
     // IE <= 8 case 
     range = document.selection.createRange(); 
     range.execCommand("BackColor", false, colour); 
    } 
}

它在Safari浏览器，Chrome浏览器等桌面浏览器中完美地工作。但在iPad Safari浏览器的情况下，选择的方式与文本选择方式不同，就像在任何桌面浏览器中一样，我没有得到突出显示文本的结果。

enter image description here

我简单的HTML代码是：

 <div><h1>Introduction </h1></div> 

    <div>   
      <p>This is an example: </p> 
      <p>in other paragraph.</p> 
      <p>one more paragraph </p> 

      <button type="button" onclick="highlight('yellow')">Click Me!</button> 
    </div>

请建议，如果需要进行任何更改或任何其他API需要被包括在内。

来源

2012-12-17 Satish

您通过touchend -event（和+ click桌面支持）来触发highlight -function：

jQuery的

$('button').on('click touchend', function() { 
    highlight('yellow'); 
});

Fiddle

来源

2012-12-17 14:00:59 yckart

感谢您的答复。但我不觉得它工作。 – Satish

你使用哪个iOS版本？ – yckart

雅感谢它的工作，在旧版本的jquery中，它不被支持。我必须下载新的jQuery库1.8.3。。早先我使用jquery 1.6.4，不支持它。 – Satish

选择和iPhone/iPad的网络浏览器Safari浏览器不工作

回答

相关问题