模糊ipad

Question

如果你會在ipad上使用contenteditable div，你會發現模糊事件沒有得到註冊。

在下面的答案中提供了一個快速入門。

Answer 1

這個答案的答案在這裏：https://gist.github.com/shimondoodkin/1081133 基本上，我們創建一個輸入元素，它可以正確地註冊模糊，並將焦點改變並將其模糊，只要可以理解的div應該模糊。我調整了shimondoodkin的解決方案，完美地工作，正確定位輸入元素，以便頁面在試圖集中輸入元素時不會突然滾動。

if(/AppleWebKit\/([\d.]+)/.exec(navigator.userAgent)) { 
    function getPos(el) { 
     for (var lx=0, ly=0; el != null; lx += el.offsetLeft, ly += el.offsetTop, el = el.offsetParent) return {x: lx,y: ly}; 
    } 

    var refocus_prevtarget = null, inp = ce("input", "", document.body); inp.setAttribute("tabIndex","-1"); inp.style.cssText = "width:1px; height:1px; border:none; margin:0; padding:0; position:fixed"; 
    function refocusContentEditable(e) { 
     var curelement=getEvtSrc(e); 
     if(refocus_prevtarget) { // if we have a previous element 
      // if previous element was contentEditable and the next isn't then: 
      if(refocus_prevtarget.contentEditable == 'true' && curelement.contentEditable !== 'true') { 
       var p = getPos(refocus_prevtarget); inp.style.left = p.x; inp.style.top = p.y; // change the position of the input element to near the last elem 
       inp.focus(); inp.blur(); // set caret focus to input el that handles blur correctly 
       curelement.focus(); // focus the wanted element 
      } 
     } 
     refocus_prevtarget=curelement; 
    } 
    aeh(document.body, "touchend", refocusContentEditable); // add global click handler 
}