以編程方式在UIWebView中選擇文本

Question

經過2天的研究，我問這個問題。 我已經閱讀了stackoverflow和google中的所有相關問題和答案（包括這個問題，這是非常相似但沒有答案）仍然無法找到解決方案。 希望有人能夠提供幫助。

我有一個UIWebView，其中加載了一些文本。 我想以編程方式選擇文本的一部分，就像用戶長按它一樣。

我已經嘗試執行此javascript代碼作為對點擊的響應：

function selectEl(x,y)
{
    document.designMode = "on";
    var el = document.elementFromPoint(x, y);
    var range = document.createRange();
    range.selectNodeContents(el);
    var sel = document.getSelection();
    sel.removeAllRanges();
    sel.addRange(range);
    document.designMode = "off";
}

我已經嘗試過，無需在設計結束時將designMode更改為“off”。 我知道這段代碼“選擇”了正確的元素，因為如果我執行這個命令

document.execCommand("BackColor", false, "#ffffcc");

它實際上突出顯示了我單擊的元素，但它不會導致選擇文本。 關於如何實現這一點的任何想法？

Answer 1

這似乎是Mobile Safari中的一個錯誤。 當我在touchstart contentEditable切換為true並在touchend其設置為false時，它可以正常工作。 如果我刪除這些行並刷新它仍然有效。 如果我關閉Mobile Safari，清除緩存，然后重新打開文檔並刪除它，它將再次停止工作。

我已經使用工作版更新了下面的代碼（雖然為了簡單起見我刪除了長按）。

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">

(function() {
    var node,
        range,
        offset,
        clientX,
        clientY;

    document.addEventListener("DOMContentLoaded", function() {
        document.body.addEventListener("touchstart", function(event) {
            var selection = window.getSelection();
            selection.removeAllRanges();

            clientX = event.touches[0].clientX;
            clientY = event.touches[0].clientY;

            range = document.caretRangeFromPoint(clientX, clientY);
            node = range.startContainer;
            offset = range.startOffset;

            document.body.contentEditable = "true";
            event.preventDefault();
        });
        document.body.addEventListener("touchmove", function(event) {
            var selection = window.getSelection(),
                range = document.caretRangeFromPoint(event.touches[0].clientX, event.touches[0].clientY),
                newRange = document.createRange();

            if(clientY < event.touches[0].clientY) {
                newRange.setStart(node, offset);
                newRange.setEnd(range.startContainer, range.startOffset);
            }
            else {
                newRange.setStart(range.startContainer, range.startOffset);
                newRange.setEnd(node, offset);
            }

            selection.removeAllRanges();
            selection.addRange(newRange);

            event.preventDefault();
        });
        document.body.addEventListener("touchend", function(event) {
            document.body.contentEditable = "false";
            event.preventDefault();
        });
    });
})();
</script>
<body>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempus volutpat mauris sed porta. Phasellus euismod malesuada eleifend. Donec mattis, orci quis scelerisque mattis, turpis sem pulvinar nisi, et sagittis nunc nisi sed nulla. Pellentesque pharetra consequat neque, ultrices mattis mauris auctor id. Aenean tincidunt turpis non odio gravida semper. Praesent feugiat, lorem at lacinia tristique, orci eros tincidunt leo, at adipiscing sapien felis at tellus. Phasellus ac est nec nibh posuere euismod vel vitae neque. Vestibulum mollis adipiscing urna ut tristique. Vivamus purus tortor, venenatis id aliquam nec, elementum et lacus. Praesent elementum purus eget sapien ornare laoreet. Vestibulum ac odio enim.
</body>
</head>
</html>

Answer 2

只是一個想法：確保你沒有在你的CSS中使用這樣的東西：

* {
  -webkit-touch-callout: none;
   -webkit-user-select: none;
   user-select: none;
}

這可以防止任何文本選擇。

Answer 3

我遇到了這個：

hitElem.style.backgroundColor = "highlight";
hitElem.style.color = "highlighttext";

或者，本網站已經編寫了一些可怕的腳本，但它可以幫助你:)它適用於范圍。

以編程方式在UIWebView中選擇文本

問題描述

3 個解決方案

解決方案1
2 已采納 2012-11-28 21:58:21

解決方案2
0 2012-11-30 10:00:21

解決方案3
-3 2012-11-30 14:22:53

以編程方式在UIWebView中選擇文本

問題描述

3 個解決方案

解決方案1 2 已采納 2012-11-28 21:58:21

解決方案2 0 2012-11-30 10:00:21

解決方案3 -3 2012-11-30 14:22:53

解決方案1
2 已采納 2012-11-28 21:58:21

解決方案2
0 2012-11-30 10:00:21

解決方案3
-3 2012-11-30 14:22:53