使用JQuery移動觸摸SVG事件

我在一個包含每個頁面中的SVG的Web應用程序上工作，爲了翻頁，我必須使用滑動（左和右）。而對一個div或者IMG等任何問題檢測刷卡事件，但它是不可能對包括SVG文件:(使用JQuery移動觸摸SVG事件

我使用jQuery 1.6.4和jQuery Mobile的1.0b3檢測觸摸事件。

JS：

$('.touchPad object').live('swipeleft swiperight',function(event){ 
    var currentPage = getVar("page"); 
    if(currentPage == "0") 
    { 
     currentPage = 1; 
    } 

    if (event.type == "swiperight") { 
     currentPage ++; 
     var page = "page="+currentPage; 

     $.mobile.changePage({ 
     url: "http://asample.com/JQueryMobileTests/index.php", 
     type: "get", 
     data: page}, 
     "slide", 
     true 
     ); 
    } 
    if (event.type == "swipeleft") { 
     currentPage --; 
     var page = "page="+currentPage; 

     $.mobile.changePage({ 
      url: "http://asample.com/JQueryMobileTests/index.php", 
      type: "get", 
      data: page 
     }); 
    } 
    event.preventDefault(); 
});

HTML：

<div role-data="page" class="touchPad"> 
    <div role-data="header"></div> 
    <div role-data="content"> 
     <div> 
      <h1>Page : </h1> 
      <object type="image/svg+xml" data="pict.SVG" width="800" height="800"></object> 
     </div> 
    </div> 
</div>

來源

2011-09-23 juju_b55

我剛剛發佈了類似的問題http://stackoverflow.com/questions/22415992/how-is-jquery-mobile-interfering-with-my-mouse-touch-listening-on-svg-documents。在Chrome DevTools中查看jquery移動代碼的Cursory顯示了一些停止傳播鼠標事件的地方，但我不確定SVG的具體情況，如果有的話。 –

試圖讓其中包含的點擊動畫SVG刷卡活動時，我有完全相同的問題，我發現T上的唯一途徑o獲取滑動事件是將覆蓋svg的div與不透明度設置爲0，然後我在SVG上丟失了單擊事件。

<svg style="width:100px; height:100px" /><div style="position:absolute; width:100px; height:100px; opacity:0">&nbsp;</div>

來源

2011-10-05 16:31:22 user980779

使用JQuery移動觸摸SVG事件

回答

相關問題