在epub閱讀器中突出顯示並添加筆記功能ios

我正在爲ios和android開發epub閱讀器。我想實現文本高亮，並添加筆記功能到我的epub閱讀器。我想知道如何爲固定佈局epub提供這些功能。我可以通過javascript:window.getSelection()得到選定的對象。我想保存並檢索這些對象以供將來使用。下面的代碼我用來突出顯示和保存文本：在epub閱讀器中突出顯示並添加筆記功能ios

var selection; 
var storedSelections[]; 

function highlightText() { 
if (window.getSelection) { 
    selection = window.getSelection(); 
} 
if (selection.rangeCount > 0) { 
    var range = selection.getRangeAt(0); 
    var selectedText = range.toString(); 
    var span = document.createElement("span"); 
    span.id = "span_" + range.startOffset + "_" + range.endOffset ; 
    alert(span.id); 
    span.onclick = function() { 
    myOnclikFunction(selectedText);}; 
span.setAttribute("class","uiWebviewHighlight"); 
    span.style.backgroundColor = "skyblue"; 
    range.surroundContents(span); 

    selection.removeAllRanges(); 
    selection.addRange(range); 

    for (var i = 0; i < selection.rangeCount; i++) { 
     storedSelections.push (selection.getRangeAt (i)); 
    } 
    selection.removeAllRanges(); 
    localStorage.setItem('storedSelections',storedSelections); 
}}

我用這個代碼檢索突出顯示的文本：

function ShowStoredSelections() { 
storedSelections.length=0; 
var retrieved= localStorage.getItem('storedSelections'); 
storedSelections.push (retrieved); 
var selection = window.getSelection(); 
for (var i = 0; i < storedSelections.length; i++) { 
    selection.removeAllRanges(); 
    selection.addRange (storedSelections[i]); 
    if (selection.rangeCount > 0) { 
     var range = selection.getRangeAt(0); 
     var selectedText = range.toString(); 

     var span = document.createElement("span"); 
     span.id = "span_" + range.startOffset + "_" + range.endOffset ; 
     span.onclick = function() { 
      myOnclikFunction(selectedText); 
     }; 
     span.setAttribute("class","uiWebviewHighlight"); 
     span.style.backgroundColor = "red"; 
     range.surroundContents(span); 
     selection.removeAllRanges(); 
     selection.addRange(range); 
    } 
}}

我可以檢索到的文本不能添加到selection.addRange。我在這做錯了什麼？

請給我一些想法或建議來解決這個問題。

在此先感謝您的任何答覆或答案。

來源

2013-03-12 Ashini

嗨可以有任何解決方案關於上述問題，因爲我也面臨同樣的問題，請幫助我 – dineshprasanna 2013-03-14 05:34:14

我做了使用[此代碼]的文本亮點（http://stackoverflow.com/questions/15495447 /爲什麼-ibooks的-犯規放棄的文本亮點和相加個音符的功能合固定鋪設），然後」的NSString * HTML = [網頁視圖stringByEvaluatingJavaScriptFromString：@ 「document.documentElement.outerHTML」];的NSString * CURRENTURL = webview.request.URL.absoluteString; [HTML將writeToFile：CURRENTURL原子：YES編碼：NSUTF8StringEncoding誤差：＆錯誤];」我不知道我的做法是否正確。但它的作品。 – Ashini 2013-04-01 09:13:03

嗨@Ashini我所指向的鏈接我沒有得到任何的代碼，如果可能的話，你可以發送代碼，請幫助我，我spended大量的時間，但我沒有任何答案 – dineshprasanna 2013-04-01 10:26:46

我已經實現了所有這些爲androd的本土球員的epub和iOS-其對一個組織產品研發& d

而不是使用getSelection遵循以下steps.Its繁瑣，但功能將得到充分的你的控制之下

- >提供的URL的UIWebView（IOS）或的WebView（機器人）

- >在回調的WebView的didload - 包裝所有文字字到跨，唯一ID

- >傳播觸摸事件webview-的JavaScript會處理這些觸摸使用function onTouchMove(e)

- >獲得使用document.elementFromPoint

感動跨度 - >突出那些跨度（字） - >您將獲得每個跨度$('#wordID-'+sWordID).position()的位置，你從Javascript傳遞這些價值爲本地代碼

- >添加便籤查看到網頁視圖的超視圖

注：更好的jQuery的注入在運行時進入的WebView用於包裝的話到跨度

來源

2014-08-07 14:40:52

在epub閱讀器中突出顯示並添加筆記功能ios

回答

相關問題