HREF鏈接在iPad上不起作用

Question

所以我寫了一個菜單作為表格的嵌套列表：

<ul id="nav-secondary" class="menu">
  <li><a href="javascript:;">About Us</a>
    <ul>
      <li><a href="http://our.site.com/about-us/index.php">Our History</a></li>            
      <li><a href="http://our.site.com/about-us/affiliates.php">Affiliated Stuff!</a></li>
      <li><a href="http://our.site.com/about-us/what-is-science/index.php">What is Science?</a></li>
      <li><a href="http://our.site.com/about-us/cognoscente-email-list.php">Cognoscente Email List</a></li>
      <li><a href="http://our.site.com/about-us/life-in-bloomington.php">Life In Bloomington</a></li>
      <li><a href="#">Science Links</a>                                              
        <ul>                                                                                   
          <li><a href="http://our.site.com/about-us/science-links/current-issues.php">Current Issues</a></li>
          <li><a href="http://our.site.com/about-us/science-links/experiments.php">Experiments</a></li>
          <li><a href="http://our.site.com/about-us/science-links/scientists.php">Some scientists</a></li>
          <li><a href="http://our.site.com/about-us/science-links/professional-organizations.php">Professional Organizations </a></li>
        </ul>
      </li>
      <li><a href="http://our.site.com/about-us/contact-information.php">Contact Us</a></li>      
      <li><a href="http://our.site.com/about-us/spotlights.php">Spotlights</a></li> 
      <li><a href="http://our.site.com/about-us/employment.php">Employment</a></li>        
    </ul>
  </li>
.
.
.

這持續了一段時間。 我已經編寫了一些jQuery，以使其具有不錯的滑動效果。 這在文檔准備功能中。

$('#nav-secondary li ul').hide();
$('#nav-secondary li a').each(function () {
  var a = $(this);
  var href = $(this).attr('href'); 
  var current_page = window.location.pathname;
  if(href.indexOf(current_page) !== -1 && current_page !== "/" && current_page!== "/index.php") {
    $(this).addClass('active');
    $(this).parents().addClass('active');
    $(this).parents().show();
    $(this).attr("href", "javascript:;");
  }

});

$('#nav-secondary li > a').on('click touchstart', function() {
  if ($(this).attr('class') != 'active'){
    $(this).next().slideToggle();
    $(this).parents().addClass('active');
  } else {
    if(href.indexOf(current_page) !== -1 && current_page !== "/") {
      $(this).slideToggle();
    } 
  }   
});   

因為我們希望人們能夠使用他們的iPad瀏覽我們的網站。 在iPad上，滑動菜單有效，但頁面上的所有鏈接均無效，除非您將手指按住它們，否則會出現Safari的對話框，允許您打開/在新標簽/窗口/中打開它。等等 除滑動菜單部分外，所有鏈接都需要觸摸才能打開。

Answer 1

您是否正在使用jQuery mobile？

在jQuery中學習的第一件事是調用$（document）.ready（）函數中的代碼，以便一旦加載DOM，一切都將執行。 但是，在jQuery Mobile中，Ajax用於在導航時將每個頁面的內容加載到DOM中，而DOM ready處理程序僅對第一頁執行。 要在每次加載和創建新頁面時執行代碼，可以綁定到pageinit事件。 此事件在本頁底部詳細說明。

Answer 2

如果您使用的是Web視圖，則必須了解Web視圖包含一些委托方法，以便從該委托方法中查找click事件，您需要像這樣調用URL

[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"www.google.com"]];

這是在單擊Web視圖內的任何鏈接時將觸發的委托方法

    -(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
if (navigationType == UIWebViewNavigationTypeLinkClicked) {
{
   [[UIApplication sharedApplication] openURL:[request URL]];
}

}

Answer 3

因此，有一個彈出js文件，其中包含一些有關懸停的代碼。 這段代碼實際上並沒有錯。

這里的主要問題是iPad可以將單擊事件注冊為懸停式事件，與觸摸端偵聽器競爭。

iPad / iPhone懸停問題導致用戶雙擊鏈接

Answer 4

不要重新創建輪子...使用現有的jQuery滑塊菜單

• http://designscrazed.org/jquery-navigation-plugins-menus/
• http://jquery-plugins.net/tag/slide-menu
• http://mmenu.frebsite.nl/
• http://www.berriart.com/sidr/