2014-04-29 21 views
0

如果你会在ipad上使用contenteditable div,你会发现模糊事件没有得到注册。模糊ipad

在下面的答案中提供了一个快速入门。

回答

0

这个答案的答案在这里: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 
}