e.preventDefault(); iPad에서 작동하지 않습니다.

Question

내 머리를 긁적니다. a) 팝업 메뉴를 사용하여 사용자가 메뉴, 즉 메뉴 등과 상호 작용할 수 있고 외부에서 클릭/터치 (iPad 등)를 닫으려는 경우. "e.preventDefault();를 삽입하면 문제가 발생합니다. 팝업과 그 부모의 뒤에 링크를 중지하려면 iPad에서 작동하지만 팝업의 내용은 바탕 화면 브라우저에서 잘 작동합니다 ....

아무도 아이디어가 있습니까?!

<div id="divQuickCartDialogOverlay"> 
    <div id="divQuickCartDialog"> 
     <div id="overlayQuickBasket"><!--SELECT MENUS, BUTTONS ETC HERE --></div> 
    </div> 
</div> 

<script language="javascript" type="text/javascript"> 
     $(document).ready(function() 
     { 
      // Initial call 
      setTimeout(basketExpiryCheck, 60000); 

      // old style quick basket 
      $('#divQuickCart').mouseleave(function() { 
       closeCart('mleave'); 
      }); 

      // hide cart dialog if user clicks on background div 
      $(document).on('click touchstart', function (e) 

      { 
       e.preventDefault(); 

       var container = $("#divQuickCartDialog"); 
       if (container.has(e.target).length === 0) 
       { 
        closeCartDialog(); 
       } 
      }); 

      checkBasketRefresh(); 
     }); 

    </script> 


<style> 
#overlayQuickBasket { margin:0 auto; } 
body, html { height:100%; } 
#divQuickCartDialog { height:100%;width:100%; } 
</style> 

<script> 
$(function() { 
    $('#overlayQuickBasket').each(function() { 

     $(this).parent().css('position', 'relative'); 
     $(this).css('position', 'absolute'); 
     $(this).css('top', '50%'); 
     $(this).css('left', '0px'); 
    }); 
    $(window).resize(function() { 

     var thisheight = Math.round(parseInt($('#overlayQuickBasket').outerHeight())/2); 
     $('#overlayQuickBasket').css('margin-top', '-' + thisheight + 'px'); 

     if(parseInt($('#overlayQuickBasket').outerHeight()) > parseInt($('#overlayQuickBasket').parent().outerHeight())) { 

      $('#overlayQuickBasket').parent().outerHeight($('#overlayQuickBasket').outerHeight()); 
     } 
    }).trigger('resize'); 
}); 
</script> 

Answer 1

대신 그것을 시도 할 수 : 그럼 대체

#divQuickCartDialog { 
    outline:0; 
    height:100%; 
    width:100%; 
} 

: 단지 스타일

<div id="divQuickCartDialog" tabindex="-1"> 
    ... 
</div> 

CSS outline 0으로 설정 :

세트

이 사업부 #divQuickCartDialog에 대한의 tabindex 속성 귀하의 문서 click 및 touchstart로 핸들러 : #divQuickCartDialog이 열릴 때

$("#divQuickCartDialog").on('blur', function(){ 
    closeCartDialog(); 
}); 

, 당신은 거기에 focus을 설정해야합니다.