iPhone（iOS 8.4あたりから。iOS9も継続して発生）、なぜかSafari, Chromeで、アンカーリンク(anchor要素のhref)が動作しない問題が発生。（追記：iOS10では解決しているようです）

正確には、１回目のクリック（タップ）で、リンクに飛ばない。２回目のタップで、ようやくリンクに飛ぶ。また、アンカー要素だけでなく、javascriptのクリックイベントが全滅で同じような動作となった。

また、手持ちの端末では、Android、PCブラウザでは問題は発生ないので、iOSの問題のようです。

怪しい箇所＝「:hover」

代わりに、onclickのイベントハンドラでlocation.href=’xxxx.com’などとスクリプトで処理させようとしてみたりにしてみたり、jQueryからもダメで、かなり困りました。

網羅的に調べられてないですが、挙動を調査したところ、１回目のクリックで、ホバー状態に見た目が変化していることから、CSSの擬似クラス「:hover」まわりが怪しかったです。

あと、主にブロック要素（display:block）にしている要素だけかもしれない（ここは、あまり深追いせず・・、たぶん、という感じです。）

ひとまず、CSSで該当要素の:hoverの指定を全て消去して、なんとか復帰しました。

緩和策

さすがに「hoverのスタイル一切なし」というのも厳しいので・・・、簡単に以下のように対応しました。

@media screen and (max-width: 780px) {
  a:hover{ 
    /* ホバースタイルは横幅が大きなデバイスだけ */
  }
}

iPad横にしたら780超えるんじゃ・・・とかありますけど、基本的に割合の低いユーザさんは、ごめんなさいという方針です。（まあ、２回クリックすれば、動くし、OK）useragent などで、細かい分岐設定もできそうですけど、コードを複雑にしたり、手間をかけたりしたくないのです。

ググると「javascritptで、touchendにしろ」とか書いてる記事もあるけど、該当要素をブロック（display:block）にして大きく領域をとっていると、ユーザが下にスクロールしようとして、その要素を触ると、touchendが発火してしまって、ユーザビリティ的に、ひどいことになるのでこのやり方はダメでした。

以上です。