問題タブ [touchstart]

ここに小さなサンプルアプリがあります: http://codepen.io/DouglasGlover/full/OPpMaV/

これはモバイル専用のエクスペリエンスです (ただし、技術的にはデスクトップでも機能します)。ここではモバイルのみを考慮します。

意図した動作は、ユーザーが自分の電話に触れて、電話 (画面上の任意の場所) で指を押したままにすることです。彼らがこれを行うと、カウンターが上がります。電話から指を離すと、カウンターが停止します。

ユーザーが (おそらく誤って) 携帯電話を回転させて、サイトの向きが切り替わるユース ケースがあります。現在、それが発生した場合、カウンターは無限に上向きにカウントし続けます。後続のタッチで 2 番目のタッチ イベントが開始され、処理が速くなります (最初の問題を修正することで対処できます)。

したがって、私の問題は、向きを切り替えると、タッチイベントが「死ぬ」ことです。したがって、「touchstart」が最初に発火し、決して発火しない「touchend」を待っています。

理想的には、ユーザーが電話に触れてから、結果を伴わずに (そしてエクスペリエンスを中断することなく) 回転させることができます。

これが現在のプロトタイプコードです...

HTML:

CSS:

JS:

イベントを使用touchstartして Web アプリケーションでタッチを検出しようとしています。Chrome では問題なく動作していますが、Windows 8.1 上の Firefox 36.0.1 (デスクトップ版) ではイベントがまったく発生しません。

私は何か間違ったことをしていますか、それともこれはバグですか? 最小限の実例はここにあります。

次のコードを使用して、IOS デバイスのメニューの外側でページに触れたときにナビゲーション サブメニューを閉じています。問題は、メニュー内のリンクに触れると、それも閉じてしまうことです。私の質問は、サブ メニュー内のナビゲーション リンクに触れて div が閉じられないようにしながら、ページの他の場所に触れたときにその機能を維持するにはどうすればよいかということです。

https://jsfiddle.net/4a4o0ctt/1/

誰かがこれで私を助けてくれることを願っています。fancybox2 つのリンクを含むポップアップを作成しました。1 つはユーザーを調査ページに移動し、もう 1 つはポップアップをキャンセルして閉じます。

デスクトップでは期待どおりに動作しましたが、モバイル デバイスでも動作する必要があります。そこで、タッチ イベントを処理する変数を作成し、on イベント ハンドラーを更新しました。

デスクトップでは問題なく動作しますが、電話でテストすると、リンクを選択しても何も起こりません。誰もが同様の問題に遭遇しますか? この問題を解決する方法を知っていますか? 提案/アドバイスは大歓迎です。

モバイル/タブレットでスクロール イベント (スクロールの途中) を発生させる方法について、同様の質問がありました。以下に示すコードを使用しましたが、これを chrome エミュレーターで動作させるにはまだ至っていません。

touchstart は、タッチ センサーでスクロールするとログに記録されますが、touchmove ではログに記録されません。私は何が欠けていますか？

私は iOS 7 でこの問題をデバッグしようとしてきましたが、気が狂いそうです。私は iDangerous Swiper ( http://www.idangero.us/swiper/get-started/ ) を使用しています。スライド内のクリック可能なボタンを使用して、次のスライドに進みます。そのボタンのクリックには AJAX 送信もあります。touchstart イベントを使用して、モバイルでのクリックの信頼性を高めようとしています。これは成功しましたが、iPhone 6 (iOS 7) では、最初のスライドが移動する前にスワイパーがちらつき/サイズ変更されます。私がテストした他のすべてのブラウザでは問題ありません。

デバッグするために、発生するすべてのイベントを数秒遅らせて、setTimeout を使用してどのイベントが原因であるかを確認しました。イベントを遅らせると、ちらつき/サイズ変更は発生しません。

これを引き起こしている原因やデバッグ方法についてのアイデアがありません。

jquery トリガーは次のとおりです。

「cursor:pointer」の修正も試みましたが、うまくいきませんでした。誰かアイデアをください！

次のように、JQuery を使用してイベントをリッスンしています。

touchstartただし、タッチされた要素に特定のクラスがあるかどうかをリッスン/検出したいだけです。.hotspot このクラスがない場合、クリックのみをリッスンしたいのですが、これを行う方法はありますか?

ウェブサイト ベースのドロップダウン メニューの jquery コードを変更しようとしています。具体的には、Android ブラウザー ビルド 4.4.2 Samsung Galaxy S4 で発生する時期尚早の touchcancel イベントの回避策に取り組んでいます。

これが私が作業しようとしているコードです:

ほとんどのデバイスとほとんどのブラウザーで問題なく動作します。その特定の Android ブラウザーでのみ、メニューがドロップダウンし、すぐに再びスライドアップします。時期尚早の touchcancel イベントが発生していると想定しています。さまざまなことを試しましたが、これらすべての要素を持っているようには見えず、何を試してもそのデバイスでタッチキャンセルが起動しません。

Android ブラウザでこの問題を回避するためにできることはありますか?

非常に具体的な問題があります。ボタンのある携帯電話用のWebページを書いています。IE を含むすべてのブラウザーで検出toucheventしていますが、IE では非常に具体的です。数秒後に自動的に終了します。どうにかして助けてくれませんか？これが私のコードです（変更されたものですが、まだ正しく機能していません）：

そしてhtmlタグには次のものが含まれています：

しかし、それも役に立ちません。

データ要素をターゲットにしながら、jQuery 経由でクリックをトリガーしようとしています。トリガー クリックは、デスクトップ デバイスでは問題なく機能しますが、タッチ デバイスでは機能しません。私はここでいくつかの読書をしていました:ブラウザでjquery touchstartを実行し、touchstartイベントをバインドしようとしましたが、まだ機能していません。以下は、touchstartイベントの有無にかかわらず私のコードです。